Question

这就是我想要的

jQuery：

        $("body").on('click','.js-validate-url',function(){
            var url = $(".url").val();
           if(url==""){
              // STOP WORKING OF .js-loader click
             // I want if url is empty it should not alert
           }else{
             //OK
             // and here it should work fine
             // it should alert
           }
        });
         $("body").on('click','.js-loader',function(){
         alert();
        });

HTML
    <form>
        <input class="url">
        <button class="js-loader js-validate-url"></button>
   </form>
    <form>
       <button class="js-loader"></button>
    </form>

我为什么要这么做

所有按钮的上层类别都不同
但是所有按钮的加载程序类都是相同的，它显示了单击按钮内部的加载程序

我发现了

e.stopPopagation();

但是，如果我在加载程序中使用它，它可以执行以下操作：单击回调，但是我想在单击按钮并且url为空时停止

无法在加载程序单击中检查url ==“”，这是因为所有按钮都是相同的，我也不想检查其他按钮，因此请检查单个按钮

Answer 1

我建议使用类检查条件。

    $("body").on('click','.js-loader',function(){
            var _this = $(this)
           if(_this.hasClass('js-loader') && _this.hasClass('js-validate-url')){
             
             // if both classes js-loader, js-validate-url are present on button
             alert()
             
           }else{
            
            alert("js-loader") // if only js-loader present on button
            
           }
        });

Answer 2

我不确定我是否了解您要执行的操作，但是我想您可以将事件合并为一个事件，并仅在满足条件时使用外部函数。

您也可以使用removeEventListener，但我认为您不需要它来解决问题。

var myFunction = function(){
  alert('loader');
};

$("body").on('click','.js-validate-url',function(){
  var url = $(".url").val();
  if (url){ alert('validate: '+url); }
  else myFunction();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="text" value="google.com" class="url"/>

<button class="js-validate-url js-loader">Bt1</button>

<button class="js-loader">Bt2</button>

Answer 3

这就是我所做的，并且按照我的要求可以正常工作

     $("body").on('click','.js-validate-url',function(){
        var url = $(".url").val();
       if(url==""){
          // STOP WORKING OF .js-loader click
         // I want if url is empty it should not alert
       }else{
         $(this).removeClass("js-diable");
         //OK
         // and here it should work fine
         // it should alert
       }
    });


     $("body").on('click','.js-loader',function(){
     if($(this).hasClass('js-scud-disabled')){
         //NOTHING TO DO
     }else{
         alert();
     }
    });

HTML

    <form>
      <input class="url">
      <button class="js-loader js-validate-url js-disable"></button>
    </form>

    <form>
      <button class="js-loader"></button>
    </form>

Answer 4

$("body").on('click','.js-loader',function(){
    if($(this).hasClass('js-loader js-validate-url')){
        alert();
    } else {
         if(url==""){
         } else {

         }
    }
});

jQuery-其他类的Stop事件

4 个答案: