確定後JQuery對話框點擊無法正常工作

Question

我製作了一個JQuery對話框，但由於某種原因，點擊「確定」按鈕時執行的代碼無法正常工作。

我想在那裏有一個「確認對話框」，一個人點擊編輯按鈕後，會基本上警告用戶他們將編輯可能不應該編輯的內容。此外，如果用戶點擊「確定」按鈕，我希望編輯輸入是可編輯的，同時隱藏編輯按鈕。

儘管如此，其他一切工作都是應該的。例如，當用戶點擊關閉或取消按鈕時，對話框會正確關閉，並且當用戶單擊確定按鈕時，警報將起作用，並且對話框會正確關閉。所以唯一不能正常工作的是警報和對話框關閉之間的代碼。

function ShowDialogBox(title, content) { 
     $("#lblMessage").html(content); 
     $("#dialog").dialog({ 
      resizable: false, 
      title: title, 
      modal: true, 
      width: '400px', 
      height: 'auto', 
      bgiframe: false, 
      hide: { effect: 'fade', duration: 400 }, 
      buttons: [ 
       { 
        text: 'OK', 
        "class": 'showcss', 
        click: function() { 
         alert('hello'); 
         $("#edit_input").attr("readonly", false); 
         $("#edit_input").focus(); 
         $('#edit_button').hide();    
         $("#dialog").dialog('close'); 
        } 
       }, 
       { 
        text: 'Cancel', 
        "class": 'showcss', 
        click: function() { 
         $("#dialog").dialog('close'); 
        } 
       } 
      ] 
     }); 
    } 

Answer 1

的問題是，我是在關閉對話框之前作出的行動。

function ShowDialogBox(title, content) { 
    $("#lblMessage").html(content); 
    $("#dialog").dialog({ 
     resizable: false, 
     title: title, 
     modal: true, 
     width: '400px', 
     height: 'auto', 
     bgiframe: false, 
     hide: { effect: 'fade', duration: 400 }, 
     buttons: [ 
      { 
       text: 'OK', 
       "class": 'showcss', 
       click: function() { 
        $("#dialog").dialog('close'); 
        $("#edit_input").attr("readonly", false); 
        $("#edit_input").focus(); 
        $('#edit_button').hide();          
       } 
      }, 
      { 
       text: 'Cancel', 
       "class": 'showcss', 
       click: function() { 
        $("#dialog").dialog('close'); 
       } 
      } 
     ] 
    }); 
} 

Answer 2

問題是屬性名稱readOnly是大小寫性的。

代碼中使用prop代替attr：

function ShowDialogBox(title, content) { 
    $("#lblMessage").html(content); 
    $("#dialog").dialog({ 
     resizable: false, 
     title: title, 
     modal: true, 
     width: '400px', 
     height: 'auto', 
     bgiframe: false, 
     hide: { 
      effect: 'fade', 
      duration: 400 
     }, 
     buttons: [{ 
      text: 'OK', 
       "class": 'showcss', 
      click: function() { 
       alert('hello'); 
       $("#edit_input").prop("readOnly", false); 
       $("#edit_input").focus(); 
       $('#edit_button').hide(); 
       $("#dialog").dialog('close'); 
      } 
     }, { 
      text: 'Cancel', 
       "class": 'showcss', 
      click: function() { 
       $("#dialog").dialog('close'); 
      } 
     }] 
    }); 
}