javascript - 编辑表格上的值后如何更新字段（使用jquery或javascript）

Question

我有一个购物车，在有人将商品添加到购物车后，他们可以更改数量并单击更新以进行所需的更改。但是，单击它后，我希望它说已更新！

现在，如果有人再次点击该字段来更新它。它应该变回一个显示更新的按钮。

我该怎么做呢？我对 jquery 或 javascript 不是很熟悉

谢谢你。

Answer 1

不确定您是如何触发服务器更新的，但这里有一个简短的片段，您可以使用它：

    $('document').ready(function(){

       $('#yourInputField').change(function() {

           $('#yourButton').addClass('enable');

        });

         $('#yourButton').on("click",function() {

          //Fire ajax for server, onsuccess is ajax success method
           onsuccess(e){
           $(this).removeClass('enable');
           $(this).addClass('disable');
           };

        });

    });

Answer 2

这是一个让您入门的基本示例：

HTML

<div class="item">
    <input class="amount" type="text" />
    <div class="update">
        <button class="update-button" type="button">Update</button>
        <div class="update-message">Updated!</div>
    </div>
</div>

JS

$('.update-button').click(function () {
    // Hide the update button
    $(this).hide()
    // Show the update message
    $(this).siblings('.update-message').show();
});

$('.amount').click(function () {
    // Show the update button
    $(this).closest('.item').find('.update-button').show();
    // Hide the update message
    $(this).closest('.item').find('.update-message').hide();
});

jsfiddle