DOM要素が置き換えられたときにjQueryが機能しない

Question

サブカテゴリを選択すると、サブカテゴリがドロップダウンにロードされ、サブクエリが選択されると、選択に応じてjQuery経由で別の要素がロードされます。

相続HTMLは

<li> 
     <label for="cat">Choose The Category..</label> 
     <select name="cat" class="required"> 
     <option type=""></option> 
     <? 
     $conn = $db->query("SELECT * FROM categories WHERE parent_id = 0 ORDER BY name ASC"); 
     while($a = $db->fetch_array($conn)) { 
      echo "<option value='{$a['category_id']}'>{$a['name']}</option>"; 
     } 
     echo "</select>"; 
     ?> 
     </select> 
    </li> 
    <li id="category"> 
    </li> 

JSがこの

$("select[name=cat]").change(function() { 
    if($("select[name=cat] option:selected").val() != "") { 
     $("#category").append(get_sub($("select[name=cat] option:selected").val())); 
    } 
}); 
$("select[name=category]").change(function() { 
    if($("select[name=category] option:selected").val() != "") { 
     $("#filters").append(get_filters($("select[name=category] option:selected").val())); 
    } 
}); 

ファーズのように動作しますが、私はsuコマンドを追加した場合だけで罰金、第二の機能はのみ動作負荷までのサブカテゴリー機能私はJSを介してロードする場合、彼らは働いていない呼び出しのためのファイヤーバットを介してチェックされ、サブカテゴリーのロードだけ、任意のアイデアが起こる？あなたはlive event handlersを使用する必要が

Answer 1

：

は、現在および将来の、現在のセレクタに一致するすべての要素のイベントにハンドラを接続します。

ライブイベントリスナーがドキュメントルートに添付されています。それらが起動すると、渡されたセレクタがjQueryによってチェックされ、要素が一致するかどうかが確認されます。これにより、セレクタに一致する要素のイベントを現在聴くことができます。との将来です。

例（未テスト）：

$("select[name=cat]").live('change', function() { 
    if($("select[name=cat] option:selected").val() != "") { 
     $("#category").append(get_sub($("select[name=cat] option:selected").val())); 
    } 
}); 
$("select[name=category]").live('change', function() { 
    if($("select[name=category] option:selected").val() != "") { 
     $("#filters").append(get_filters($("select[name=category] option:selected").val())); 
    } 
});