.click не работает, когда он входит в оператор if

Question

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

Я пытался использовать return false;, и я пытался $("#crearCuestionario").click();, что идентификатор из первой ссылки, поэтому, когдаон вводится, если он щелкает по первой ссылке, чтобы пользователь не мог ввести вторую ссылку.

вот код:

function checkCampoVacio() {
            var titulo = $("#titulo").val();
            var textCuestionario = $("#mansajecreator2").val();
            var textCuestionario2 = $("#mensajecreator100").val();
          debugger;   
            if(titulo  ==  ''){     

                $("#titulo").css("border","1px solid red");
                $("#crearCuestionario").click();
                alert("Porfavor no dejes campos vacios");



            }else if (textCuestionario == '') {

                $("#mansajecreator2").css("border","1px solid red");
                $("#crearCuestionario").click();   
                alert("Porfavor no dejes campos vacios");
                document.getElementById("crearCuestionario").click();



            } else if(textCuestionario2 == ''){

                $("#mansajecreator100").css("border","1px solid red");
                alert("Porfavor no dejes campos vacios");
                 $("#crearCuestionario").click();   

            }else{
                 savelmainf();
            }

        }

        $("#saveMainQuest").click(function() {

         checkCampoVacio();

        }); 

А вот HTML-код ссылки/ buttons:

<!-- Stepper -->
        <div class="steps-form-2" >
            <input type="hidden" id="masteridquest" value="{{ $idcuestionario }}">
            <div class="steps-row-2 setup-panel-2 d-flex justify-content-between">
                <div class="steps-step-2">
                    <a href="#step-1" id="crearCuestionario" class="btn btn-amber btn-circle-2 waves-effect ml-0" data-toggle="tooltip" data-placement="top" title="Crear cuestionario"><span class="glyphicon glyphicon-edit"></span></a>
                </div>
                <div  id="masteridquestb" class="steps-step-2">
                    <a href="#step-2" id="saveMainQuest" class="btn btn-blue-grey btn-circle-2 waves-effect" data-toggle="tooltip" data-placement="top" title="Crear preguntas"><span class="glyphicon glyphicon-comment"></span> </a>
                </div>
                <div   id="masteridquestc" class="steps-step-2">
                    <a href="#step-3"  id="saveMainQuest2"  class="btn btn-blue-grey btn-circle-2 waves-effect" data-toggle="tooltip" data-placement="top" title="Probar cuestionarios"><span class="glyphicon glyphicon-ok-circle"></span></a>
                </div>
                <div   id="masteridquestd" class="steps-step-2">
                    <a href="#step-4"  class="btn btn-blue-grey btn-circle-2 waves-effect mr-0" data-toggle="tooltip" data-placement="top" title="Terminar y publicar"><span class="glyphicon glyphicon-thumbs-up" ></span></a>
                </div>
            </div>
        </div>

Мне нужно, чтобы, когда пользователь нажимает на вторую ссылку, он не пускал его, если входные данные пустые или просто возвращали его туда, где он был.

Answer 1

Из соображений безопасности Javascript затрудняет симуляцию щелчка пользователем по ссылке.

Вы можете сделать эту работу, хотя, создав привязку jQuery и запустив страницу, на которую вы хотите перейти,основанный на том элементе, по которому щелкаютметод вне if-check:

$("#crearCuestionario").on('click', function() {
    window.location.href = $(this).attr('href');
});

Немного больше кода, но это должно решить его за вас.