私はjQueryのUIタブをAjax経由で使用します。 content1.htmlにはダイアログとボタンがあります。 「Ajaxタブ1」を選択した場合、「開く」ボタンをクリックしてdlg_set_awd dialog
を開き、このダイアログを閉じて別のタブを選択し、「Ajaxタブ1」をもう一度選択して「開く」ボタンをクリックすると、 。別のタブを選択するとダイアログをクリアするにはどうすればよいですか?jQueryのUIタブのダイアログをクリアする方法
私のコード:
タブファイル:
</script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<script type="text/javascript">
$(function() {
$("#tabs").tabs();
});
</script>
HTML:
<div class="demo">
<div id="tabs">
<ul>
<li><a href="#tabs-1">Nunc tincidunt</a></li>
<li><a href="ajax/content1.html">Ajax Tab 1</a></li>
<li><a href="ajax/content2.html">Ajax Tab 2</a></li>
</ul>
<div id="tabs-1">
<p>ABC</p>
</div>
</div>
</div><!-- End demo -->
content1.html
<script type="text/javascript">
$(document).ready(function(){
$('#dlg_set_awd').dialog({
autoOpen: false,
height: 100,
width: 400,
modal: true,
buttons: {
'Save': function() {
},
Cancel: function() {
$('#dlg_set_awd').dialog('close');
}
},
close: function() {
}
});
$('#open').click(function(){
$('#dlg_set_awd').dialog('open');
});
});
</script>
HTML:
<form id="form1">
<table id='dlg_set_awd' title="Set ward for participant">
<tr>
<td width="400px" style=" vertical-align:top;">
<div style="float:left; width:90px; padding-right:11px;">
<div style="width:90px;" class="id1">First name</div>
<input type='text' id="first_name" style="width:90px" class="ui-widget-content" />
</div>
<div style="width:90px; float:left; padding-right:11px;">
<div style="width:90px;" class="id1">Last name</div>
<input type='text' id="last_name" style="width:90px" class="ui-widget-content" />
</div>
</td>
</tr>
</table>
<button id='open' type="button">Open dialog</button>
</form>
@moguzalp:多くの感謝:) – Hainlp