0

JQueryには、入力要素またはいくつかの洗練された子孫に.findメソッドを使用するための魔法/ニュアンスがあるようです(または私は盲目です)。これは私のJSコードです:

<div id="edit_lists_div">
  <div style="width: 100%; margin-bottom:5px">&nbsp;
  <button value="" style="display: none;" id="edit_lists_div_btn1">Btn1</button>
  <button value="" style="display: none;" id="edit_lists_div_btn2"
  disabled="disabled">Btn2</button>
  <button value="" style="display: none;" id="edit_lists_div_btn3"
  disabled="disabled">Btn3</button>
  </div>
  <div style="width: 100%; height: 210px; overflow: auto;">
  <table class="my_grid" id="edit_lists_div_table">
      <thead>
      <tr>
          <th width="30"></th>
          <th style="display: none;">id</th>
          <th width="100">Title</th>
          <th width="25">Some field 1</th>
          <th style="display: none;">some_property</th>
          <th>Some field 2</th>
      </tr>
      </thead>
      <caption>Lists</caption>
      <tbody>
      <tr>
          <td property_name="">
          <input row_selector="true" type="checkbox">
          </td>
          <td style="display: none;" property_value="157" property_name="id">157</td>
          <td property_value="List1" property_name="title">List1</td>
          <td property_value="4" property_name="subscribers_count">4</td>
          <td style="display: none;" property_value="9867,9869,9871,9868"
          property_name="subscribers">9867,9869,9871,9868</td>
          <td property_value="New" property_name="status">New</td>
      </tr>
      </tbody>
  </table>
  </div>

入力フィールドを取得したいだけ

<input row_selector="true" type="checkbox">

そしてなんとか管理。しかし、.findはそれを見つけることができません! これが私がすることです:

var tmp = $("#edit_lists_div").find("tbody");
var div_inputs = tmp.find("input"); // it is empty!

ここで何が問題なのですか?

更新 1:注、解決策はまだ見つかりません。すでに正しい答えを選択しましたが、アプリのコンテキストでは機能しなくなったため、選択を解除しました。私はこの答えを意味します:

var tmp = $("#edit_lists_div").find("tbody");    
var div_inputs = $('input[type="checkbox"]', '#edit_lists_div');

FIRST Firebug のデバッグだけで動作可能でした。空/not_found JQueryオブジェクトが再びありました。

同じ話がこのコードにも当てはまります:

var tmp = $("#edit_lists_div").find("tbody");    
var div_inputs = $('input', '#edit_lists_div');

初めてそれが機能しました。しかし、2回目の試行で壊れました。ここに何という神秘主義が!?

更新 2:私のハンドラーで起こりうる問題については...そうではありません! この場合、このコードをチェックしました:

$.ajax({
url : getUrl(),
dataType : "json",
success : function(data) {
   // my code goes here and still can't get input element!
  }
});

更新 3:これらの入力が必要な場合:

div_inputs.each(function() {
// some business logic with found inputs goes here
});
4

4 に答える 4

0

OK、解決策が見つかりました。JQueryにはありませんでした。それは私のアプリのアーキテクチャにありました。JS コードの前に非同期の $.ajax 呼び出しがあり ました。成功関数でテーブルが作成されましたが、ご存知のように、成功メソッドの処理前にこのテーブル要素にアクセスしようとしました。作成される前です!

それが誰かを助けることを願っています。AJAX に注意してください。

于 2012-12-12T11:32:52.187 に答える
0

どのような問題が発生しているのかわかりません。投稿したコードは、jsfiddler.net で正常に動作します。

http://jsfiddle.net/BstRW/

// フォーマットされたコードを含めることは、stackoverflow が私の jsfiddle リンクに満足していることです。

var tmp = $("#edit_lists_div").find("tbody");
var div_inputs = tmp.find("input"); // it is empty!
alert(div_inputs.attr("type"));
于 2012-12-11T21:17:32.943 に答える
0

.find()代わりに、セレクターを廃止してチェーンすることをお勧めします。

 var $checkbox = $('#edit_lists_div tbody input');
于 2012-12-11T21:12:42.603 に答える
0

テーブルにはIDがあり、見つけやすいはずで、チェックボックスが1つしかないため、テーブル内でチェックボックスを検索します。

$(function() {
    $('input[type="checkbox"]', '#edit_lists_div_table').prop('checked',true);
});
于 2012-12-11T21:07:05.537 に答える