.click进入if语句时不起作用

Question

我需要验证一些输入，以便用户单击第二个链接，例如如果输入为空，请不要让用户单击第二个链接。我知道它进入了函数，因为当它进入 if 语句时我有一个警报，但它不会点击。

我尝试使用return false; 并且我尝试了$("#crearCuestionario").click();that id 来自第一个链接，所以当它进入时，如果它点击第一个链接，以便用户不进入第二个链接。

代码如下：

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：

<!-- 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").click();  

到

$("#crearCuestionario").trigger('click');  

然后，在if-check 之外的方法中捕获点击：

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

更多的代码，但这应该可以为您解决问题。