Question

我写了一段代码：

$('.Edit').live('click', function() {
    if ($(this).text().valueOf()=="Save"){
        alert('sauvegarder..');
        var id = $(this).attr("id");
        $(".d"+id).prop('enabled', false);
        $(".d"+id).css("background-color","#FFF");
        $(".d"+id).css("border-color","black");
        $(this).text('Save').button("refresh");
    } else if($(this).text().valueOf()=="Edit") {
        alert('editer..');
        var id = $(this).attr("id");
        $(".d"+id).prop('disabled', false);
        $(".d"+id).css("background-color","#FFF");
        $(".d"+id).css("border-color","red");
        $(this).text('Save').button("refresh");
    }
}

它具有此功能：按钮通常处于“编辑”模式，当我点击所有输入元素变为启用时，我可以在其中写入内容，同时按钮名称更改为“保存”。当我单击“保存”时，输入将被禁用，我无法再写入。但是当我执行此代码时，它会同时生成所有代码，因此我有两个警报并且输入保持启用状态。我想要一些切换效果，我想知道它是否可能。

Answer 1

我没有得到enabled财产。您也可以链接事件或缓存它。

$('.Edit').on('click','.Edit', function() {
    if ($(this).text().valueOf()=="Save"){
        alert('sauvegarder..');
        var id = $(this).attr("id");
        $(".d"+id).prop('disabled', true)
                  .css({"background-color":"#FFF", "border-color":"black"});
        $(this).text('Save').button("refresh");
    } else if($(this).text().valueOf()=="Edit") {
        alert('editer..');
        var id = $(this).attr("id");
        $(".d"+id).prop('disabled', false)
                  .css({"background-color":"#FFF", "border-color":"red"});
        $(this).text('Save').button("refresh");
    }
});

Answer 2

您也可以尝试使用此类代码来禁用更改属性：

... $（“。d”+ id）.attr（'禁用'，'禁用'）。css（...）....

Answer 3

$('.Edit').live('click', function() {
    var el = $(this);   
        var r = $(".d"+el.attr("id"));
        if (el.hasClass('editMode')){
        el.removeClass('editMode');
                alert('sauvegarder..');
        r.attr("disabled", "disabled").css({
                    "background-color":"#FFF",
                    "border-color":"black"
                });
        el.text('Save').button("refresh");
    } else {
        el.addClass('editMode');
                alert('editer..');
        r.removeAttr("disabled").css({
                    "background-color","#FFF",
                    "border-color","red"
                });
        el.text('Save').button("refresh");
    }
}

在jquery中切换效果

3 个答案: