1

3 つのdivと 1 つのボタンがあります。私のjQueryスクリプトでは、ボタンをクリックするたびに、これらの 3 つのdiv要素が一度に更新されます。

HTML コード

<input id="refresh" type="button" value="Refresh"/>
<div id="R1">Value 1</div>
<div id="R2">Value 2</div>
<div id="R3">Value 3</div>

Jクエリコード

var $JQ_ = jQuery.noConflict();

$JQ_(document).ready(function () {

    $JQ_("#refresh").click(function () {
        $JQ_("#R1").load("index.php#R1").fadeOut(1000).fadeIn(1000);
    });
    $JQ_("#refresh").click(function () {
        $JQ_("#R2").load("index.php #R2").fadeOut(1000).fadeIn(1000);
    });
    $JQ_("#refresh").click(function () {
        $JQ_("#R3").load("index.php #R3").fadeOut(1000).fadeIn(1000);
    });
});

JSFIDDLE 例 はこちら。

私がやりたいことは、コードを短くして、すべての div に対して同じことを書く必要がないようにすることです。他のスクリプトでは、このようなものを使用しています

 $JQ_("[id^='opener_']").click(function () {
     $JQ_("#dialog_" + this.id.split('_')[1]).dialog("open");
 });

しかし、これは別のケースです。コードをこのように機能させるにはどうすればよいですか?

4

2 に答える 2

2

更新する div を 1 つのクラスに配置し、jQuery コードのクラス識別子を使用します。これにより、各 div に同じコードをコピーして貼り付けることなく、複数の div で jQuery コードを実行できます。

于 2013-10-24T18:07:21.757 に答える