1

私はチャットボックスの閉じるボタンを作成しようとしています、そして私は私のjquery関数を1つの動的関数に単純化する方法を学ぼうとしていますあなたはここで私のjsfiddleをチェックすることができます

これはいくつかのコードスニペットです：

//Close chat
$('.close1').click(function () {
    //do what ever you want here
    $('.wrap_box1').hide();
});

$('.close2').click(function () {
    //do what ever you want here
    $('.wrap_box2').hide();
});

$('.close3').click(function () {
    //do what ever you want here
    $('.wrap_box3').hide();
});

このスクリプトはおそらく10回または20回までループするので、このスクリプトを縮小して保存できる関数が1つあるといいのですが。

4

1 に答える 1

1

pには共通クラスを使用し、divとrelateにはそれぞれ共通クラスを使用できます。

ライブデモ

HTML

<p class='close'>Close 1</p>
<div class="wrap_box">Content here</div>
<p class='close'>Close 2</p>
<div class="wrap_box">Content here</div>
<p class='close'>Close 3</p>
<div class="wrap_box">Content here</div>

Javascript

$('.close').click(function () {
    $(this).next('.wrap_box').hide();
});

OPコメントに基づいて編集

イベントをバインドするために間違ったクラスを使用しました。また、次の代わりにここで検索する必要があります

ライブデモ

HTML

<div class="wrap_box">
    <p class='close'>Close 1</p>Content here</div>
<div class="wrap_box">
    <p class='close'>Close 2</p>Content here</div>
<div class="wrap_box">
    <p class='close'>Close 3</p>Content here</div>

Javascript

$('.wrap_box').click(function () {
    $(this).find('.close').hide();
});
于 2013-03-25T09:35:23.370 に答える