0

HTMLテーブルがあります

 <table id="sometable">
 <tr>
   <td>
       <table class="wTable">
            <tr>
                 <td>
                       <input type="radio" name="rdGroup" val="0" /> 
                 </td>
                 <td>
                       <input type="radio" name="rdGroup" val="5" />
                 </td>
                 <td>
                       <input type="radio" name="rdGroup" val="10" />
                 </td>
            </tr>
       </table>
   </td>
 </tr>
 </table>

TD内のテーブルの理由は、スキニングとポジショニングを目的としています。私はJQueryに関しては得意ではなく、そのセルがクリックされたときにそのラジオボタンにアクセスするためのセレクター手法があるかどうか疑問に思っていました。

たとえば、以前は私のコードは(スキニング前)として設定されていました:

 <table>
 <tr>header stuff</tr>
 <tr>
     <td>data</td>
     <td>data 2</td>
     <td><input type="radio" name="rdGroup" value="0"> No Warranty </br>
         <input type="radio" name="rdGroup" value="5"> 1 year Warranty </br>
         <input type="radio" name="rdGroup" value="10"> 2 year Warranty </br>
     </td>
     <td>data 3</td>
 </tr>
 <tr>footer stuff</tr>
 </table>

上記は、元の基本的なテーブル構造です。

 $("#dnn_ctr391_Account_ctl00_ctl01_grdItems tr:first,#dnn_ctr391_Account_ctl00_ctl01_grdItems tr:last").addClass("info");

上記は、テーブルのヘッダーとフッターにinfoという名前のクラスを追加しました(私はそれらのデータを気にしませんでした)

そこから、データを処理するためのtdクリック関数を作成しました。

 $("#dnn_ctr391_Account_ctl00_ctl01_grdItems tr:not(.info) td:nth-child(7)").click(function() { //DO CODE HERE });

そして、そのクリック機能内で、必要な他のセルからのデータにアクセスすることができました。

 var warval = 0;

 warval = $(this).closest("tr").find("input[type=radio]:checked").val();

同じスタイルのコーディングを使用してアクセスを取得し、そのセルをクリックしてラジオボタンの値を取得し、そのテーブルを離れて現在のTDに戻り、アクセスを取得する方法はありますか? $(this).closest( "tr")。find()メソッドを使用して他のtdに?

あなたが提供できるどんな助けにも感謝します。

4

2 に答える 2

1

私はあなたがこのようなものを探していると思います:

$('table#sometable table.wTable td').click(function () {
    var isChecked = $(this).children('input[type=radio]').val();
    //To get 'back to the tr'
    var $warval = $(this).closest("tr");
});
于 2012-12-10T16:00:39.187 に答える
0

わかりました、コメントであなたが言ったことから、私はこれが役立つことを願っています:

まず、テーブルのマークアップをdivに変更することをお勧めします。これは必須ではありませんが、よりクリーンで管理しやすいコードになります。多分このような何か:

<p>data 1</p>
<p>data 2</p>
<div>
    <input type="radio" name="rdGroup" id="rdGroup_0" value="0" />
    <label for="rdGroup_0">No Warranty</label>
</div>
<div>
    <input type="radio" name="rdGroup" id="rdGroup_5" value="5" />
    <label for="rdGroup_5">1 year Warranty</label>
</div>
<div>
    <input type="radio" name="rdGroup" id="rdGroup_10" value="10" />
    <label for="rdGroup_10">2 year Warranty</label>
</div>
<p>data 3</p>
<div class="footer">Footer</div>

jQueryフックは次のように単純にすることができます。

$(function() {
    $('input[type=radio]').change(function() {
        // do whatever needs to be done here when the radio button value changes
        console.log("value '"+this.value+"' was selected for the warranty option");
    });
});​

DBに保存されているデータを使用してフォームをロードするときに対応する値を設定する必要がある場合は、次の関数を使用して設定できます(上記のようにラジオボックスIDを設定した場合)。

var setWarrantyOption = function(value) {
    $('#rdGroup_' + value).click();
};

ここでコードをいじることができます:http://jsfiddle.net/gruese/fsj2v/

それが役立つかどうか、または私があなたの問題を誤解した可能性があるかどうかを教えてください。

于 2012-12-10T17:17:31.050 に答える