Question

如果sendMessageAppendData（）已在当前的js会话中执行，我将如何阻止sendMessageAppendData（）被添加到'newMessageSpace'id之前。

function sendMessageAppendData() {
return '<table id="newMessageBox1" cellpadding="0" cellspacing="0" style="border-radius: 3pt; width: 267px; border: 1px solid #CCCCCC">'+
           '<tr>'+
           '<td valign="top" class="font1" style="text-align: center; padding: 3pt">You are messaging <?php echo $row->firstname." ".$row->lastname ?></td>'+
           '</tr>'+
           '<tr>'+
           '<td valign="top" style="text-align: center; width: 253px; padding: 3pt">'+
           '<input autofocus placeholder="Type your message" id="responseMessage" spellcheck="false" autocomplete="off" class="textbox1" type="text" style="width: 185pt; height: 17px" /></td>'+
           '</tr>'+
           '</table>';
}

$('#clickSendAMessage').live('click', function() {
    $('#newMessageSpace').prepend(sendMessageAppendData());

});

Answer 1

哦，这些很有趣 - 试试这个：

function sendMessageAppendData () {
   console.log("I ran!");
   sendMessageAppendData = function () {}
}

只是为了'超级干净'的建议..

var clickSendAMessageHandler = function() {
    $('#newMessageSpace').prepend(sendMessageAppendData());
    $('#clickSendAMessage').die('click', clickSendAMessageHandler );
}
$('#clickSendAMessage').live('click', clickSendAMessageHandler);

基本上是相同的想法 - 你使用自我引用来阻止它再次发生的事情。

Answer 2

借助于使用javascript全局范围变量

var Isexcuted=0;
function sendMessageAppendData() {
Isexcuted=1;
return '<table id="newMessageBox1" cellpadding="0" cellspacing="0" style="border-radius: 3pt; width: 267px; border: 1px solid #CCCCCC">'+
           '<tr>'+
           '<td valign="top" class="font1" style="text-align: center; padding: 3pt">You are messaging <?php echo $row->firstname." ".$row->lastname ?></td>'+
           '</tr>'+
           '<tr>'+
           '<td valign="top" style="text-align: center; width: 253px; padding: 3pt">'+
           '<input autofocus placeholder="Type your message" id="responseMessage" spellcheck="false" autocomplete="off" class="textbox1" type="text" style="width: 185pt; height: 17px" /></td>'+
           '</tr>'+
           '</table>';
}

$('#clickSendAMessage').live('click', function() {
    if(Isexcuted==0)
    $('#newMessageSpace').prepend(sendMessageAppendData());

});

Answer 3

假设您不介意其他依赖项，Underscore.js有once方法。

Answer 4

这是一个小实用程序，您可以使用它来使任何函数只运行一次：

 function onceOnly(fn) {
     var executed = false;
     return function() {
         if (!executed) {
             executed = true;
             fn.apply(this, arguments);
         }
     };
 }

然后，只需编写sendMessageAppendData = onceOnly（sendMessageAppendData）;

Answer 5

您可以检查该元素是否已存在：

$('#clickSendAMessage').live('click', function() {
    if(!$('#newMessageBox1')) {
        $('#newMessageSpace').prepend(sendMessageAppendData());
    }
});

更好的解决方案是将live替换为one：

$('#clickSendAMessage').one('click', function() {
   $('#newMessageSpace').prepend(sendMessageAppendData());
});

这样jQuery确保它只执行一次。

Answer 6

您可以使用.data()保存状态。

$('#clickSendAMessage').live('click', function() {
    var newMessageSpace = $('#newMessageSpace');
    if (!newMessageSpace.data('prepended')) {
        newMessageSpace.prepend(sendMessageAppendData()).data('prepended', true);
    } 
});

请注意.live已弃用，您可以改为使用.on。

Answer 7

我更喜欢通过将执行变量附加到函数本身来完成所有范围内的操作：

function testFunc() {
  if(!arguments.callee.hasOwnProperty("executed")) {
    arguments.callee.executed = true;
    //alert("First Run");
  }
  else {
    //alert("Too late!");
  }
}

防止js函数在执行时执行

7 个答案: