Отправить несколько форм на другие сайты одним щелчком мыши. (Он не поддерживает AJAX.)

Я использую jQuery для отправки нескольких форм с помощью этой функции:

<script>
    var submitted = "";
    function submitAllForms() {               

        var i=0;

        $("form").each(function () {

               submitted +=  $(this).submit();
               alert("submitted:"+i);

              i++;  
        });
    }

</script>';

Но это не для всех. Он отправляет и публикует данные только на одном сайте. Другими словами, размещается только одна форма.

2 ответа

Решение

ОТВЕТИТЬ ОБНОВЛЕНИЕ

Согласно комментарию:

Это работает на Firefox, но не работает на Google Chrome

Эта проблема связана с событием dom ready. Это не работает в Firefox. Я протестировал измененный фрагмент с последними версиями Chrome, FF, Edge, IE. Только для FF мне нужно было использовать загрузку события вместо готовности.

Возможное решение может быть основано на IFRAMES (если вы можете их использовать):

  • используйте уникальную кнопку для отправки всех форм
  • вставить или создать контейнер div без видимости
  • для каждой формы вставьте в предыдущий div iframe
  • добавить к такому фрейму содержание соответствующей формы с обновленными данными
  • отправить каждую форму внутри соответствующего фрейма
  • будьте осторожны, чтобы опорожнить контейнер...

Фрагмент:

function onIframeReady(doc, html) {
  doc.find('body').append(html);
  //
  // if it's needed to change the action atr use:
  // doc.find('form').attr('action', 'new ac');
  //
  doc.find('form').submit();
}

$(function () {
  $('#submitMoreForms').on('click', function(e){
    $('#frmWrapper').empty();
    $('form').each(function(idx, ele){
      $(ele).find(':input').each(function(index, element) {
        if (element.type == 'textarea') {
          $(element).text($(element).val());
        } else {
          $(element).attr('value', $(element).val());
        }
      });

      $('<iframe>', {
        id:  'frm' + idx
      }).appendTo('#frmWrapper').ready(function() {
        if (window.mozInnerScreenX == null) {  // if not firefox
          onIframeReady($('#frm' + idx).contents(), ele.outerHTML);
        }
      }).one('load', function(e) {
        if (window.mozInnerScreenX != null) { // if firefox
          onIframeReady($('#frm' + idx).contents(), ele.outerHTML);
        }
      });
    });
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<form action="action1" method="post">
  FORM1:<br/>
    Name: <input type="text" name="name" />
    Comment: <textarea name="comment"></textarea>
    <input type="checkbox" name="vehicle" value="Bike"> I have a bike
    <input type="checkbox" name="vehicle" value="Car" checked> I have a car
</form>
<form action="action2" method="post">
  FORM2:<br/>
    Name: <input type="text" name="name" />
    Comment: <textarea name="comment"></textarea>
</form>
<form action="action3" method="post">
  FORM3:<br/>
    Name: <input type="text" name="name" />
    Comment: <textarea name="comment"></textarea>
</form>

<input id="submitMoreForms" type="button" value="Submit More Forms" />
<div id="frmWrapper" style="display: none;"></div>

Вы не можете отправить несколько форм на одной странице таким образом. Он всегда будет отправлять первую форму, с которой сталкивается, потому что после отправки формы страница будет обновляться (отправлять). Такого рода вещи должны быть сделаны с помощью AJAX или HTTP HTTP-запроса.

Есть один вариант, который вы можете попробовать: установить пустую цель формы, поэтому при отправке откроется новая вкладка или окно браузера. Таким образом, вы можете отправить все формы. Я должен предупредить вас об этом, если вы хотите использовать его в приложении, которое используют другие пользователи, кроме вас, потому что большинство браузеров блокируют всплывающие окна, созданные отправкой формы.

Другие вопросы по тегам