2

このFiddle では、画像をクリックすると jQuery ダイアログが表示されます。ダイアログには、画像に固有のテキストが含まれている必要があります。たとえば、法律事務所の画像には法律事務所に関するテキスト、業界の画像には業界に関するテキストなどがあります。

問題は、一度 3 つの画像をそれぞれクリックしてからさらに画像をクリックすると、クリックしたばかりの画像のダイアログではなく、クリックした 3 つの画像の最後に関連するダイアログが返されることです。

誰かが私が間違っていることを指摘できますか?

HTML

<div id="sf">

    <a href="dialogcontent/lawfirms.html" title="Law firms" id="sfimage">
        <div class="circle hovershadow lawfirms lawfirms-box-shadow">Law firms</div>
    </a> 
    <a href="dialogcontent/industry.html" title="Industry" id="sfimage">
        <div class="circle hovershadow industry industry-box-shadow">Industry</div>
    </a> 
    <a href="dialogcontent/in-house.html" title="In-house legal counsel" id="sfimage">
    <div class="circle hovershadow in-house in-house-box-shadow text">In-house
            legal counsel</div> 
    </a>
</div>

Javascript:

$(document).ready(function () {
var $loading = $('<img src="http://ubuntuone.com/5qQ3i4ctM8HAvRsSIZKgqd" alt="Loading ..." class="loading">'); 
var $dialog = $('<div></div>')

$('#sf a').each(function () {

         $dialog.append($loading.clone());
    var $link = $(this).one('click', function () {
        $dialog.load($link.attr('href') + ' #content')
            .dialog({
            title: $link.attr('title'),
            width: 500,
            height: 300
        });

        $link.click(function (e) {

        //    e.preventDefault();
            $dialog.dialog('open');

            return false;
        });

        return false;
    });
});
});
4

1 に答える 1

0

「1」メソッドを使用しています。そのため、クリック イベントは要素ごとに最大 1 回実行されます。

そのため、その要素のハンドラーが既に実行されている場合は、ダイアログに最後に読み込まれたコンテンツが表示されます。

于 2013-03-23T11:18:42.763 に答える