Question

我有一个jquery方法，我在点击按钮时使用了调用该方法。所以在那段代码中我有一行＆＃34; $("#loadingMessage").css('padding-top','6%');＆＃34;当我们第一次调用该方法时，我需要这一行只执行一次，后来我走了这一行。

所以请帮助我找到一种方法

整个方法脚本位于

之下

$('#SearchButton').click(function() {                 
         $(".spinner").css('visibility','hidden');

         $("#loadingMessage").css('padding-top','6%'); //I want this line execute only once, i mean first time

         loaderStart();
         document.getElementById('loadinggif3').style.display = "block";
         $("#loadinggif3").show();
         $(".col-sm-9").css('visibility','hidden');
          var str = $('#SearchText').val();
          str = str.trim();
         if(str=="") return false;
        )};

Answer 1

使用jQuery .one()。使用.one（）方法时，事件处理函数仅对每个元素运行一次。

$('#SearchButton').one("click", function () {
    $("#loadingMessage").css('padding-top', '6%');
});

$('#SearchButton').click(function () {
    $(".spinner").css('visibility', 'hidden');

    loaderStart();
    document.getElementById('loadinggif3').style.display = "block";
    $("#loadinggif3").show();
    $(".col-sm-9").css('visibility', 'hidden');
    var str = $('#SearchText').val();
    str = str.trim();
    if (str == "") return false;
});

Answer 2

使用布尔值作为全局变量，如

var flag = true;

现在，在执行之前设置条件，比如

if(flag){  
$("#loadingMessage").css('padding-top','6%');  
flag=false;  
}

Answer 3

如果您想限制#SearchButton点击事件只触发一次，请使用.one方法

$('#SearchButton').one('click', function() {
  ...
});

Answer 4

如果你必须只运行一次没有特定事件绑定的通用函数，那么使用它。

$(document).one('ready', function(){
   // your code
   $("#id").on("click", function() {
        // other code
   });
});

如果在多次调用的函数内部有用（防止多次触发onclick事件）

Answer 5

快速而又脏兮兮的＆＃39;溶液：

$.first_time = true;
$('#SearchButton').click(function() {                 
    if($.first_time == true) $("#loadingMessage").css('padding-top','6%');
    $.first_time = false;
});

一些解释：您需要一个全局jQuery变量（在此示例中为$.first_time），以便在click事件的匿名函数中仍然知道它。

Answer 6

使用.one一次，然后点击其他人。检查下面

  <script>
    $(document).ready(function() {
    $('#SearchButton').one('click', function() {
         $("#loadingMessage").css('padding-top','6%'); //I want this line execute only once, i mean first time

    });    


$('#SearchButton').click(function() {                 
         $(".spinner").css('visibility','hidden');


         loaderStart();
         document.getElementById('loadinggif3').style.display = "block";
         $("#loadinggif3").show();
         $(".col-sm-9").css('visibility','hidden');
          var str = $('#SearchText').val();
          str = str.trim();
         if(str=="") return false;
        });


  } ); 

       </script>

Answer 7

您可以使用js闭包解决问题。

function once(func) {
    let isExec = false;
    return function(...arg) {
        if (isExec) return void 0;
        isExec = true;
        func.apply(null, arg)
    }
}

Answer 8

你可以检查它，检查填充顶部。如果不是6％，则需要进行设置。如果是，则跳过该行。提示：将$（'#loadingMessage'）的结果放在变量中，这样就不必进行第二次元素查找。

像这样（未经测试）：

$('#SearchButton').click(function() {                 
    var $loadMsg = $("#loadingMessage");

    if($loadMsg.css('padding-top') !== '6%'){
         $loadMsg.css('padding-top', '6%');
    }
});

这当然是假设您希望每次都在Click处理程序中执行其余代码。否则，您可以在执行处理程序后取消绑定单击。提示：改为使用jQuery on（）和off（）方法。

Answer 9

您可以在所有语言中使用bolean。

在jquery中：

var isFirst = true;

if(isFirst){  
$("#loadingMessage").css('padding-top','6%');  
isFirst=false;  
}

如何只执行一次Jquery代码？

9 个答案: