Question

我创建了一个名为'loaded'的属性按钮，初始值为'no'。点击按钮我正在运行一些ajax，在它的最后我试图将'loaded'属性设置为'yes'，这样如果用户不止一次点击按钮，ajax就不会再次运行

单击该按钮不会更改加载到“是”。但是，如果您在.attr调用之后立即执行警报：

alert($(this).attr('loaded'));

警告框确实包含“是”，这无济于事，因为一旦用户点击，上面的相同代码会在屏幕上显示“否”警告框。

如果我使用.prop而不是.attr，它们的行为方式都相同。我在这里错过了一点或.prop和.attr只是不使用自定义属性？

编辑：根据以下评论使用ajax更新了jsfiddle：http://jsfiddle.net/PDW35/5/

Answer 1

我不确定原始代码无效的原因，但$this似乎是出于某种原因的原因。尝试以下它似乎工作。 Fiddle就在这里。

我会在找到答案后立即尝试更新答案。

var loaded = $(".preview-button").attr('data-loaded');
if (loaded === "no") {
    $.ajax({
        success: function (result) {
            $(".preview-button").attr('data-loaded', 'yes');
            alert($(".preview-button").attr('data-loaded'));
        }
    });
} else {
    alert("data loaded");
}

请参阅此thread，这似乎是$this似乎无法在AJAX调用中起作用的原因。

Answer 2

阅读问题..

如果用户多次点击按钮，则不会再次运行ajax。

我认为你需要one()，它允许事件只运行一次..无需更改属性和属性

例如

 $(".preview-button").one('click',function(){
//your ajax stuff   
    alert('clicked!!!!');
 });

Answer 3

您可以为click（或submit）功能设置属性：

$( ".preview-button" ).click( function() {
    this.ajaxCompleted = this.ajaxCompleted || false;

    if ( !this.ajaxCompleted ) {
        // run your request and set this.ajaxCompleted to true in a callback;
    }

    // do other stuff
} );

Answer 4

您可以尝试以下代码：一旦您点击了数据，第二次点击将提示已加载数据。

$(".preview-button").click(function(){

var id = $(this).attr('button_id');
var loaded = $(this).attr('loaded');
    if(loaded == "no"){        
        $(this).attr('loaded', 'yes');
   }else{
        alert("Data is loaded");     
   }
});

这里的工作示例：http://jsfiddle.net/PDW35/4/

Answer 5

仅使用“ on”更改点击功能，例如以下示例：

$(document).on('click', '.element', function () {
    let myelem_attr= $(this).attr('data-my-attr');
}

使用jQuery .attr或.prop设置属性值不起作用

5 个答案: