Question

这段简单的代码在Chromium（Ubuntu）和Chrome中无效。

HTML

<input type="button" id="saveFavPunch" name="saveFavPunch" value="save" onClick="saveFavPunch()" >

SCRIPT

var req;
function saveFavPunch(){
    alert('govind singh');
    if(!req){
        req=$.ajax({
            type:"POST",                
            url:"edit?editType=saveFavPunch",
            data: {"value":document.getElementById("punchId").value},
            complete:function(){req=false},
            success: function(data){
                $.fancybox.close();
                if(data==""){
                    alert("ERROR!");
                }else{
                if(data=="0"){
                    alert("Internal Error Occurs, please try after some time");
                }else{
                    document.getElementById("favPunchline").innerHTML=data;
                }
                }                       
            }//end success
        });
    }
}

Answer 1

无法添加评论，代码没有任何问题，但要使其在jsfiddle中工作，请将onLoad更改为noWrap

每个设置的作用说明：http://doc.jsfiddle.net/basic/introduction.html#frameworks-and-extensions

基本上你需要它在一个简单的<script>标签中，而不是在onLoad事件中

摆弄您提供的代码：http://jsfiddle.net/Sam88/YEPm3/12/

Answer 2

既然您在标签中提到了jQuery，我想我会给出一个jQuery解决方案：Fiddle

HTML：

<input type="button" id="saveFavPunch" name="saveFavPunch" value="save" />

使用Javascript：

$("#saveFavPunch").on("click", function () {
    alert('hello2');
});

：）

修改

Javascript Not Running On JSFiddle可能与您的问题重复。我引用了选定的答案：


您定义的函数在onload函数中定义，因此在它们可引用之前，因为它们是在该函数中定义的，所以它们只能在该函数中引用。您可以在HTML中将它们作为全局变量引用。你有三个选择

a）（最简单，最快，不理想） - 将函数blah（）{}更改为window.blah = function（）{};使功能全球化。

b）（理想方式） - 使用不引人注目的Javascript将行为附加到JS中的DOM元素，这意味着将单独的HTML与JS联系起来。

c）让jsfiddle不包装东西onload。将onLoad更改为无包裹（正文或头部）。

所以不要你做var e = document.getElementById（'foo'）; e.onclick = lol;只在JS中。

我推荐b，因为它鼓励最佳实践。

Answer 3

只需一个更改 - JSFiddle设置从“onLoad”到“No wrap-in”并且有效：

http://jsfiddle.net/3f7PT/

onLoad选项的问题在于它在结果中输出的内容：

//<![CDATA[ 
    window.onload=function(){
        function saveFavPunch(){
            alert('hello2');
        }
}//]]>

因此，您的函数无意中被另一个函数包装，从而阻止它从onclick调用中找到。

希望这有帮助。

Answer 4

以下整个脚本可以在Chrome中正常使用。

<html>
<head>
<script>
function saveFavPunch(){
    alert('hello2');
}
</script>
</head>
<body>
<input type="button" id="saveFavPunch" name="saveFavPunch" value="save" onClick="saveFavPunch()" >
</body>

Answer 5

这有效

document.getElementById("saveFavPunch").addEventListener("click", saveFavPunch);
function saveFavPunch(){
    alert('hello2');

}

http://jsfiddle.net/6sg9R/

Answer 6

Ye JSFiddle对Alerts非常挑剔。它没有问题，因为Spassvogel显示但你的方式应该从文件而不是JSfiddle工作。

Answer 7

即使是那些遇到此类问题的人也会使用div标签

    <div id="saveFavPunch" style="height:30px; widht:100px; display:block;" onClick="saveFavPunch()">Save</div>

我认为使用此代码您的问题将会解决。

简单的功能无法在Chrome和Chromium中使用

7 个答案: