JQuery отправить форму, только если div содержит "someText" - PullRequest
Новая
       13

JQuery отправить форму, только если div содержит "someText"

0 голосов
/ 20 февраля 2019 
<div id="field"><div class="field-item ">someText</div></div><br>

<form action="submit.php">
<input type="text" >
<button id="somediv" class="button button4" >CHECK URL</button>
</form>


<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script>
$(document).ready(function(){
  $("button").click(function(event){


if ($('#field > div.field-item:contains("someText")').length > 0) {
    $("#somediv").removeClass("button button4");
    $("#somediv").addClass("button button2");
     $("#somediv").text("DOWNLOAD");
     setTimeout(() => {
             $("#somediv").removeClass("button button3");
              $("#somediv").addClass("button button4");
             $("#somediv").text("CHECK URL");
             location.reload();
        }, 8000);


}
else{
    $("#somediv").removeClass("button button4");
    $("#somediv").addClass("button button3");

     $("#somediv").text("THIS IS NOT VALID! ");
setTimeout(() => {
             $("#somediv").removeClass("button button3");
              $("#somediv").addClass("button button4");
             $("#somediv").text("CHECK URL");
             location.reload();
        }, 1000);




}
  });
});
</script>

Теперь я хочу отправить свою форму, когда кнопка нажата только в том случае, если item.consize "SomeText", и запретить отправку, если div отличается от этого текста ... Я пытался вызвать функцию onsubmtit, но вмое дело от подчиняется без условий ...

1 Ответ

0 голосов
/ 20 февраля 2019

Чтобы это сработало, сначала подключите событие submit элемента form, а не click button.Затем в логическом else вызове preventDefault() о событии, чтобы остановить отправку формы.

Также обратите внимание, что вы можете кэшировать селектор #somediv, а также СУШИТЕ вверх вызов setTimeout().Попробуйте это: 

$(document).ready(function() {
  var $div = $('#somediv');

  $("form").on('submit', function(e) {
    var timeoutDelay;
    if ($('#field > div.field-item:contains("someText")').length > 0) {
      $div.removeClass("button button4").addClass("button button2").text("DOWNLOAD");
      timeoutDelay = 8000;
    } else {
      e.preventDefault();

      $div.removeClass("button button4").addClass("button button3").text("THIS IS NOT VALID");
      timeoutDelay = 1000;
    }

    setTimeout(() => {
      $div.removeClass("button button3").addClass("button button4").text("CHECK URL");
      location.reload();
    }, timeoutDelay);
  });
});

Есть пара вещей, на которые стоит обратить внимание.Во-первых, это очень ненадежный метод проверки.Я настоятельно рекомендую пересмотреть способ включения отправки.

Во-вторых, если проверка прошла успешно, форма будет отправлена ​​немедленно, поэтому ваша 8-секундная задержка по таймауту и ​​location.reload() полностью избыточны.

...