ページにボタンがあります:
<button class="" id="new_cat_charm">Add New Category</button>
ボタンがクリックされたときにダイアログボックスを開き、サイトにオーバーレイを追加するために jquery を使用しています。
jQuery( document ).ready( function( $ ) {
var newCatButton = $( '#new_cat_charm' );
newCatButton.click( function(){
var newCatCharm = $( '#new-cat-charm' );
newCatButton.prop( 'disabled', true );
newCatCharm.removeClass( 'myhide' );
appOverlay();
});
function appOverlay() {
var docHeight = $(document).height();
$("body").append("<div id='overlay'></div>");
$("#overlay").height(docHeight).css({
'opacity' : 0.4,
'position': 'absolute',
'top': 0,
'left': 0,
'background-color': 'black',
'width': '100%',
'z-index': 5000
});
}
});
ボタンをクリックした後、ボタンを無効にしてダイアログ ボックスを表示します。
問題
ボタンをクリックすると無効になり、ダイアログ ボックスがポップアップ表示されます。ページを更新すると、ボタンは無効のままになり、強制リロード(Ctrl + F5) を実行するか、ブラウザのアドレス バー内をクリックする必要があります。通常に戻る前にエンターを押してください。