1

2 つのボタンがあるテーブル セルがあります。

<td align="left" >
 <input type="button" value="edit"/>
<input  type="button" value="save" disabled="disabled"/>
</td>

デフォルトでは、保存ボタンは無効になっています。編集ボタンをクリックしたら、保存ボタン ボタンを有効にする必要があります。問題は、テーブルが struts2 s:iterator タグを使用して動的に生成されるため、ボタンに ID を割り当てることができないことです。もしそうなら、同じIDを持つ2つ以上のセルがあります

どうすればこれを達成できますか？

4

4 に答える 4

4

click（）イベントをバインドし、 attr（）editButtonを使用しての無効なプロパティを設定する必要があります。コードを$（document）.ready（）に入れて、使用する前にDOM要素の準備ができているようにするのが安全です。saveButton

あなたはこのようにそれを行うことができます、

ライブデモ

$(document).ready(function(){

    $('#editButton').click(function(){
          $('#saveButton').attr('disabled', false);
    });
});
于 2012-11-28T16:48:02.620 に答える
2

IDで行きたい場合

$('#editButton').on('click', function(){
   $('#saveButton').prop('disabled', false);
});

複数のtdにこの種の構造がある場合は、一般化されたイベントを記述できます。このイベントでは、編集ボタンに対応するボタンのみが有効になります。

IDのない繰り返し構造の場合

$(':button[value="edit"]').on('click', function(){
       var $td = $(this).closest('td');
    $td.find($(':button[value="save"]')).prop('disabled', false);
});​

HTML

<tr>
      <td align="left">
         <input type="button" value="edit" />
         <input type="button" value="save" disabled="disabled" />
      </td>
   </tr>
     <tr>
      <td align="left">
         <input type="button" value="edit" />
         <input type="button" value="save" disabled="disabled" />
      </td>
   </tr>
     <tr>
      <td align="left">
         <input type="button" value="edit" />
         <input type="button" value="save" disabled="disabled" />
      </td>
   </tr>

フィドルをチェック

于 2012-11-28T16:48:06.830 に答える
0

id各ボタンに sは必要ありません。必要なのはevent delegationid 、テーブル全体に対してsingle class、ボタンに対して es だけです。

  1. idテーブルに割り当て、 classes をボタンに割り当てます。

    <table id="dataTable" ...>
  ...
  <td style="text-align:left;">
    <input type="button" class="edit" value="edit" />
    <input type="button" class="save" value="save" disabled="disabled" />
  </td>
  ...
</table>

  2. 単一のイベント オブザーバーをテーブルにアタッチします (もちろん、ページが読み込まれたとき)

    $("#dataTable tbody").on("click", ".edit", function(event) {
  $(this).next(".save").prop("disabled", false);
});

    class="edit"ユーザーがで表内の任意のボタンをクリックするとアクティブになり、クリックしたid="dataTable"ボタンの後にある次のボタンを見つけてclass="save"、見つかったボタンを有効にします。

于 2012-11-30T21:10:57.960 に答える
0

あなたはjqueryを使うことができます

$('#editButton').click(function(){$("#saveButton").attr('disabled',false)});

JavaScriptで

document.getElementById('saveButton').setAttribute('disabled',false);
于 2012-11-28T16:49:13.430 に答える