2016-03-30 16 views
0

私はこのコードを私のウェブサイト上の別のページにコピー/ペーストします。最初のページですべて正常に動作し、何とか2番目のページに表示されません...siblings.removeclassは画像上で動作しません

カスタムラジオボタン機能を作成しようとしています。このページには、mysqli_fetch_arrayを使って私のデータベースから読み込んだ画像が表示されます。ユーザはこれらの画像をクリックすることができる。ユーザーがイメージをクリックすると、javascriptがこのイメージに別のクラスを適用します。ユーザーが別の画像をクリックした場合は、最初の画像のクラスを復元​​し、そのクラスを最新のクリックした画像に適用する必要があります。

私は何を持っている:

スクリプト

$(window).load(function(){ 
    $('.bedragbol').click(function() { 
     var bedragid = $(this).data("bedragid"); 
     $(this).addClass('bedragbol_select').siblings().removeClass('bedragbol_select'); 
     document.getElementById("kosten").value = bedragid; 
    }); 
}); 

PHP

<table width="100%"> 
<? while($rows_bedrag=mysqli_fetch_array($sql_bedrag,MYSQLI_ASSOC)){ ?> 
<tr> 
<td class="img_programmaker_dag"> 
<img src="../images/<? echo $rows_bedrag['url']; ?>.png" data-bedragid="<? echo $rows_bedrag['id']; ?>" class="bedragbol"> 
</td> 
<td> 
<font class="txt_programmaker_dag"> 
<? echo $rows_bedrag['omschrijving']; ?> 
</font> 
</td> 
</tr> 
<? } ?> 
</table> 
<br><br> 
<input type="text" id="kosten" name="kosten"> 

私は機能が働いているかどうかを確認するために、入力フィールドを追加しました。この値は、画像をクリックするたびに更新されます。これは正常に動作します。ちょうどCSSの部分は、それが必要なように動作していません。クリックするとクラスが適用されますが、別の画像がクリックされたときにはすべての兄弟は削除されません。選択したクラスを保持します。したがって、すべての画像をクリックすると、すべての画像が選択したクラスを保持します。

私には何が欠けていますか?クリックしたクラスを除き、クラスをすべての兄弟に削除するために調整する必要があるのは何ですか?あなたがそうでなければ、私が持っているしたい関数を作成します。この

$('.bedragbol').click(function() { 
    var bedragid = $(this).data("bedragid"); 
    $(this).siblings().removeClass('bedragbol_select'); 
    $(this).addClass('bedragbol_select') 
    document.getElementById("kosten").value = bedragid; 
}); 

答えて

0

は、このコードを試してみてください。しかし、他の要素で.bedragbolクラスを使用しています。私はそれのための回避策を作成する必要がありますね。
+0

を試みる他の要素

.bedragbolクラスを使用していない場合 –

関連する問題