한 번만 열리는 두 개의 jquery UI 대화 상자가 있습니다. 여기 바이올린입니다http://jsfiddle.net/santosh_patnala/2fMqp/2/
html :
<div>
<div class="case-study-share" style="width: 24%; float: left;"> <b>Test Case One </b>
<br />
<button class="Share">Share</button>
<div id="test" class="testCase" title="Dialog Title" style="display: none">CaseStudy = Elgifto Url:http://localhost:51723/CaseStudies/Details/1</div>
</div>
<div class="case-study-share" style="width: 24%; float: left;"> <b>Test Case Two </b>
<br />
<button class="Share">Share</button>
<div id="test" class="testCase" title="Dialog Title" style="display: none">CaseStudy = Test Case Url:http://localhost:51723/CaseStudies/Details/1</div>
</div>
jquery :
$(".Share").click(function (e) {
$(this).next(".testCase").dialog();
})
제발 도와주세요
이는 첫 번째로드시 대화 상자를 초기화하고 두 번째 시도에서는 이미 초기화되어 있으므로 다시 초기화 할 수 없기 때문에 발생합니다.
나는이 바이올린에서 작동하게했습니다 : http://jsfiddle.net/2fMqp/24/
기본적으로 대화 상자 <div>
의 고유 ID를 제공하십시오 .이 경우에는 "test1"과 "test2"를 사용했습니다. 공유 버튼에 데이터 속성을 추가하여 <div>
그들이 제어하고있는 것을 알 수 있도록 data-dialogId
합니다. 이 예에서는 .
<div>
<div class="case-study-share" style="width: 24%; float: left;"> <b>Test Case One </b>
<br />
<button class="Share" data-dialogId="test1">Share</button>
<div id="test1" class="testCase" title="Dialog Title" style="display: none">CaseStudy = Test Case One Url:http://localhost:51723/CaseStudies/Details/1</div>
</div>
<div class="case-study-share" style="width: 24%; float: left;"> <b>Test Case Two </b>
<br />
<button class="Share" data-dialogId="test2">Share</button>
<div id="test2" class="testCase" title="Dialog Title" style="display: none">CaseStudy = Test Case Two Url:http://localhost:51723/CaseStudies/Details/1</div>
</div>
다음으로, 우리는 페이지로드 대화 상자의를 초기화하고, 버튼을 호출 한 후 때, 우리는 표시 할 DIV의 ID를 얻을 수 및 통화 dialog("open")
만이 아니라 dialog()
.
$( ".testCase" ).dialog({
autoOpen: false,
});
$(".Share").click(function (e) {
var dialogId = $(this).attr("data-dialogId");
$("#" + dialogId).dialog("open");
});
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다