为什么html调用js函数获取html无法找到变量错误？

我有js/jquery对话框有一些html输入按钮，允许用户选择一种颜色。点击按钮应该调用JavaScript函数changeColor。我已经将代码减少到最小集合，但是当单击其中一个颜色按钮时，我得到一个html“参考错误：无法找到变量：changeColor”错误。不知道我错过了什么。为什么html调用js函数获取html无法找到变量错误？

function changeColor(themeColor) { 
    var a = 1; 
} 

$('#change-theme').on('click', function() { 
    $('#theme').dialog({ 
     width: 500, 
     resizable: false, 
     show: 'slide', 
     autoOpen: false, 
     modal: true, 
     buttons: [{ 
      text: "Save", 
      tabIndex:-1, 
      'class':'dialog3_buttons', 
      click: function(event) { 
       $(this).dialog("close"); 
       return true; 
      } 
     }, { 
      text: "Cancel", 
      tabIndex:-1, 
      'class':'dialog3_buttons', 
      click: function(event) { 
       $(this).dialog("close"); 
       return false; 
      } 
     }] 
    }) 
    .height("auto"); 

    $("#theme").dialog("option", "title", "Theme Picker - click a color to preview"); 
    $("#theme").html(
     "<input type='button' class='color-button white-btn' id='color-button' name='white' onclick='javascript:changeColor()' >" + 
     "<input type='button' class='color-button black-btn' id='color-button' name='black' onclick='javascript:changeColor()' >" 
     ); 
    $('#theme').dialog('open'); 
});

来源

2016-09-25 Tim

为什么不简单使用'onclick ='changeColor（）' –

除非页面上的第一个脚本不是JavaScript，否则不需要'javascript：'标签。你可以删除它 – mplungjan

您必须将功能分配给一个全局范围，如果你想从HTML调用它就像你在你的例子

做这行添加到您的代码

window.changeColor = changeColor;

见这个工作例子https://jsfiddle.net/09ghrhap/1/

来源

2016-09-25 09:07:08 Ma3x

非常感谢你！我永远不会认为这是问题。最受赞赏。 – Tim

@Tim：不客气。如果你想看看，我已经更新了一下这个例子。 – Ma3x

只需将$（function/$（document）.ready – mplungjan

我想你需要把功能放入<head></head>

来源

2016-09-25 09:08:45

为什么html调用js函数获取html无法找到变量错误？

回答

相关问题