Question

我需要验证一些输入，以便用户单击第二个链接，例如，如果输入为空，则不要让用户单击第二个链接。我知道它可以使用该功能，因为当它输入if语句时会发出警报，但不会单击。

我尝试使用return false;，并尝试$("#crearCuestionario").click();，该id来自第一个链接，因此当它进入第一个链接时，如果单击第一个链接，以便用户不输入第二个链接，该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');
});

更多代码，但这应该为您解决。

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

1 个答案: