2016-11-07 6 views
0

を動作しない]をクリックすると、ヘッド部は、すべて私の他の入力のために上記のコード作業のラジオボタンの変更が/ここにAJAX</p> <p>経由で動的にロード

<head> 
    <link rel="stylesheet" type="text/css" href="templates/main.css"> 
    <link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet"> 
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" 
    rel="stylesheet"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 

    <script src="js/main.js"></script> 
</head> 

$('.vp_names').on("change", "input[name='vp_names']", function(event) { 
 
\t \t alert('got here'); // NEVER FIRES \t \t 
 
})
<div class='vp_names'> 
 
    <input id="vp_names_1" checked name='vp_names' value='1' type='radio'/> 
 
    <label class="drinkcard-cc label_card male" for="vp_names_1">George</label> 
 
    <input id="vp_names_2" name='vp_names' value='2' type='radio'/> 
 
    <label class="drinkcard-cc label_card male" for="vp_names_2">Jungle</label> 
 
</div>

バリエーションです/同じページの/ボタン/負荷。レンジ入力が機能し、他のラジオ/チェックボックスが機能します。私は変更/クリックを試みました。私は試してみました:ラジオとなし。名前を変更したり、セレクタを変更したり、親セレクタを変更したりしてラジオボタンを起動するものはありません。

**更新**

それは、コードの他のセクションでは、このように動作するよう、それは次のように変更する、働いていなかった理由を考え出すされていないが仕事をしました。したがって、同様の問題が発生している場合は、これを試してみてください。

$('#view_profile').on("change", ".vp_names", function(event) { 
    alert('got here'); 
} 

<input class='vp_names' id="vp_names_1" checked name='vp_names' value='1' type='radio'/> 
<label class="drinkcard-cc label_card male" for="vp_names_1">John</label> 

Removed class from parent div 

私はまだview_profileの「袋」を使用し、これは、Ajax経由で動的にロードするコンテンツを取り付けるための方法です。

**ソリューション**

はロブにより示唆されるようにJSキャッシュの問題されているように見えます。

+0

間違いはありますか?ページにjQueryがありますか? – Tinsten

+0

'$は定義されていません 'とは、ページにjQueryがないことを意味します。 – Tinsten

+0

エラーはありません。すべてが定義されています –

答えて

0

私はあなたのセレクタが問題だと思います。入力[名前= ...]が有効かどうかはわかりません(私の無知はそれが有効ではないという証拠ではありません)。

影響を受けるすべての入力に同じクラスを割り当て、クラスからトリガーするだけです。

<input type="radio" class="vp_radio" ... /> 

$(document).ready(function(){ 
    $('.vp_radio').on('change', function(){ 
     //logic 
    }); 
}); 
+0

このセレクタは、範囲、ボタン、チェックボックスに問題なく使用します。しかし、私はすべてを知っていない、何か間違っている可能性がある、それは私がこれを投稿した理由です。私は彼らにすべてのクラスを与えようとしましたが、それでも動作しませんでした。それは同じ読み込まれたページ内の名前/場所を除いて、同じコードを追加しているので非常に奇妙です。 –

+0

コンソールに何かログインしていますか?この要素は、どこかで問題を起こすことなく単に発火しないというのは奇妙に思えます。 – rob

+0

なぜ、私はちょうど再度試しに行ったのですか(良いオールド・サニティ・チェック) - 同じスタイルを使用しますが、ラジオでクラスに変更し、現在は発射しています。なぜそれが他の人ではなくいくつかの人にとってうまくいかない理由はありませんが、少なくともそれは今働いています! –

1

$("body").on("click","input[name='vp_names']" ,function(event) { 
 
    alert('got here'); // FIRES 
 
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class='vp_names'> 
 
    <input id="vp_names_1" checked name='vp_names' value='1' type='radio'/> 
 
    <label class="drinkcard-cc label_card male" for="vp_names_1">George</label> 
 
    <input id="vp_names_2" name='vp_names' value='2' type='radio'/> 
 
    <label class="drinkcard-cc label_card male" for="vp_names_2">Jungle</label> 
 
</div>

+0

ajaxでロードしましたか? –

0

あなたはjqueryのスクリプトを含めていないかのように表示されます。コードスニペットにはjQueryがありません。 htmlページにこれを追加します。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

+0

すでに質問がありました –

関連する問題