如何禁用使用本地存儲的站點中的按鈕？

Question

這是我的html

<div class="col-md-9">
  <table class="table table-striped table-bordered table-condensed">
    <thead>
      <tr style="background-color: white">
        <th> <i class="fa fa-male"></i> Name </th>
        <th><i class="fa fa-bars"></i> Particular</th>
        <th><i class="fa fa-envelope-o"></i>Unit</th>
        <th><i class="fa fa-map-marker"></i>Quantity</th>
        <th><i class="fa fa-phone"></i>From</th>
        <th><i class="fa fa-phone"></i>Date</th>
        <th><i class="fa fa-phone"></i>TAKE actions</th>
      </tr>
    </thead>
    <tbody>

      <tr>
        <td>COMB</td>
        <td>fasionable comb</td>
        <td>SVP</td>
        <td>3</td>
        <td>Bindibhatt1</td>
        <td>2014-03-22 18:15:34 UTC
        </td><td>
          <form action="/requisitions/2" class="button_to" method="get"><div><input class="pos" data-confirm="Are you sure?" type="submit" value = "po" ></div></form>

        </td>
      </tr>
      <tr>
      </tr>
    </tbody>
  </table>

</div>

和我的jquery

$(window).load(function(){

    $(".pos").click(function(e){
        debugger;
        localStorage.setItem("visited" + $(this).closest("tr").index(), true);
        $(this).css("color", "red"); // visited
    });

    for(var i = 0, len = $(".pos").length; i < len; i++){

        if(localStorage.getItem("visited" + i)){

            $(".pos:eq(" + i + ")").css("color", "white"); // visited

        }else
        {
            $(".pos:eq(" + i + ")").css("color", "black"); // not visited
        }
    }
});

我希望被點擊的按鈕被disabled ，並且html應該從po generated 。

Answer 1

您可以通過以下方式禁用該按鈕：

for(var i = 0, len = $("tr.pos").length; i < len; i++) {

    if(localStorage.getItem("visited" + i)) {
        $("tr.pos").eq(i).css("color", "white").prop('disabled', true).val('generated'); // visited
    } else {
        $("tr.pos").eq(i).css("color", "black"); // not visited
    }
}

您需要更具體的選擇器tr.pos因為您的 DOM 中也有input.pos （您沒有在問題中顯示）。