Javascript按鈕onclick（）不發射

Question

我想弄清楚爲什麼我的javascript沒有運行時點擊一個按鈕。我檢查過，以確保JavaScript文件加載正確，並且在控制檯中沒有錯誤。當我在控制檯中運行javascript代碼時，代碼成功運行並執行它應該執行的操作，但是當我單擊該按鈕時，它不會觸發。我相信我所有的語法都是正確的，所以我不確定是什麼導致了這個問題。

下面是按鈕的HTML：

<input class="btnSaveParameters" id="btn_SaveCriteria" onclick="return btn_SaveCriteria_onclick();" type="button" value="Save Subscription"/> 

下面是在控制檯中正確運行的JavaScript函數，但點擊該按鈕時不火：

function btn_SaveCriteria_onclick() { 
    //Testing if function fires: 
    window.alert(5 + 6); 

    var availableSelects = []; 
    $("Select").each(function() { 
     availableSelects.push($(this).attr("id")); 
    }); 
    if (
     $("#" + availableSelects[1]) 
      .find(":selected") 
      .text() + $("#" + availableSelects[2]) 
      .find(":selected") 
      .text()+$("#" + availableSelects[2]) 
      .find(":selected").text() ==='AllAllAll' 
    ) { 
     $(".PageTitle").append("<div id='dialog' title='Parameter Warning'>You cannot select all for all 3 filters</div>"); 
      $("#dialog").dialog(); 
     } else { 
      var t = document.getElementById("modal-form").cloneNode(true); 
      t.style.display = "inline"; 
      var options = { 
       title : "Add a Description to your Subscription", 
       width : 500, 
       height : 100, 
       dialogReturnValueCallback : MyDialogClosed, 
       html: t 
      }; 
     }; 
     SP.SOD.execute('sp.ui.dialog.js', 'SP.UI.ModalDialog.showModalDialog', options); 
    } 
} 

任何人都可以看到爲什麼JavaScript不按下按鈕點擊？

Answer 1

謝謝大家的意見。

我能夠得到按鈕來觸發JavaScript函數，但我不知道它爲什麼工作。

我創建了一個新函數，並將它連接到按鈕上。

function test2() { window.alert(1+1);} 

單擊該按鈕時會觸發此測試功能。然後我試着將其餘的代碼添加到test2函數中。那也開了。鑑於這個工作，我從

btn_SaveCriteria_onclick() 

改變了原來的功能名稱

test() 

，並刪除了test2的功能。出於某種原因，將名稱更改爲test（）工作，並激發了JavaScript。所以解決方法是將函數名稱從btn_SaveCriteria_onclick（）更改爲其他內容，我將其更改爲saveSubscriptionOnClick（）。

我不知道爲什麼這個工作，或爲什麼這是一個問題，但生病了。

Answer 2

可能onclick事件沒有找到函數，因爲超出範圍。

爲了確保與jQuery附加事件：

我測試，並正在於：

https://jsfiddle.net/8k9ms39s/

// this will atach btn_SaveCriteria_onclick to btn_SaveCriteria button. 

    $(function() { 
     $('#btn_SaveCriteria').click(function(){ btn_SaveCriteria_onclick(); }); 
    }); 


    // this is your unchanged function 
    function btn_SaveCriteria_onclick() { 


    //Testing if function fires: 
    window.alert(5 + 6); 

    var availableSelects = []; 
    $("Select").each(function() { 
     availableSelects.push($(this).attr("id")); 
    }); 
    if ($("#" + availableSelects[1]).find(":selected").text() + $("#" + availableSelects[2]).find(":selected").text()+$("#" + availableSelects[2]).find(":selected").text() ==='AllAllAll') { 
     $(".PageTitle").append("<div id='dialog' title='Parameter Warning'>You cannot select all for all 3 filters</div>"); 
     $("#dialog").dialog(); 

    } else { 
    var t = document.getElementById("modal-form").cloneNode(true); 
    t.style.display = "inline"; 

    var options = { title: "Add a Description to your Subscription", width: 500, height: 100, dialogReturnValueCallback: MyDialogClosed, html: t };//$('<div id="pgDiv"><form id="pgForm" method="post"><input type="text" name="Description" id="pgDescription>Description: </form></div>').get(0) }; 


    SP.SOD.execute('sp.ui.dialog.js', 'SP.UI.ModalDialog.showModalDialog', options); 

    } 
    } 

Answer 3

把你的功能腳本標記您的輸入按鈕標籤上面。 在HTML文件中：https://jsfiddle.net/L7rmb4n1/

<script> 
function btn_SaveCriteria_onclick() { 
//Testing if function fires: 
alert(5 + 6); 
var availableSelects = []; 
$("Select").each(function() { 
    availableSelects.push($(this).attr("id")); 
}); 
if ($("#" + availableSelects[1]).find(":selected").text() + $("#" + availableSelects[2]).find(":selected").text()+$("#" + availableSelects[2]).find(":selected").text() ==='AllAllAll') { 
    $(".PageTitle").append("<div id='dialog' title='Parameter Warning'>You cannot select all for all 3 filters</div>"); 
    $("#dialog").dialog(); 

} else { 
var t = document.getElementById("modal-form").cloneNode(true); 
t.style.display = "inline"; 

var options = { title: "Add a Description to your Subscription", width: 500, height: 100, dialogReturnValueCallback: MyDialogClosed, html: t };//$('<div id="pgDiv"><form id="pgForm" method="post"><input type="text" name="Description" id="pgDescription>Description: </form></div>').get(0) }; 


SP.SOD.execute('sp.ui.dialog.js', 'SP.UI.ModalDialog.showModalDialog', options); 

} 
} 

</script> 

<input class="btnSaveParameters" id="btn_SaveCriteria" 
onclick="btn_SaveCriteria_onclick();" type="button" value="Save Subscription"/> 

如果你願意把函數在不同的js文件。請在頭標記或以上的按鈕包括JS文件。

請讓我知道這是否工作。