私はjqueryにかなり慣れていないので、修正できないように見える問題を抱えています。
だから、私はいくつかのJquery UI tabsを持っています。2番目のタブには、クリックするとダイアログを起動するボタンがあります。私は以前、これと同じコードでいくつかのアコーディオンを持っていましたが、うまくいきました。
IE、Chrome、および FF での動作は次のとおりです。 2 番目のタブ (#create-file) のボタンをクリックすると、ダイアログが短時間表示され、すぐに閉じます。次に、2 番目のタブではなく、最初のタブがアクティブになります。解決策を見つけようとして、autoOpen を false から true に変更しました。その後、ボタンをクリックするとダイアログが表示されましたが、もちろん、ページが最初に読み込まれたときに表示されましたが、解決策ではありませんでした。これが私のコードです。
JS:
$("#tabs").tabs();
$("#fileform").dialog(
{
show: 'fade',
hide: 'fade',
autoOpen : false,
height : 300,
width : 350,
modal : true,
buttons : {
"Save" : function() {
$(this).dialog("close");
}
},
Cancel : function() {
$(this).dialog("close");
}
},
close : function() {
$(this).dialog("close");
}
});
$("#create-file").button().click(function() {
$("#fileform").dialog("open");
});
HTML: (実際の表示)
<div class="tabs" id="tabs">
<ul>
<li><a href="#TAB1">TAB 1</a></li>
<li><a href="#TAB2">TAB 2</a></li>
</ul>
<div id="TAB1">
<p>LOREM IPSUM KLJLKJLKJKLJKLJHGHGFHGJHLKJH</p>
</div>
<div id="TAB2">
<div class="scrollable">
<ol class="selectable" id="supportfiles">
</ol>
</div>
<button id="create-file">Save File</button>
</div>
ダイアログ コード:
<div id="fileform" title="New File">
<p class="validateTips">Please enter data.</p>
<form>
<fieldset>
<label for="filepath">File</label> <input type="file"
name="filepath" id="filepath"
class="text ui-widget-content ui-corner-all" /> <label
for="description">Description</label> <input type="text"
name="description" id="description" value=""
class="text ui-widget-content ui-corner-all" />
</fieldset>
</form>
</div>