Question

我尝试在页面中注入一个按钮，我想让它可以点击，但它似乎根本不起作用。

$(".something").append('<button style="background-image: \
-webkit-gradient(linear, left bottom, left top, color-stop(0.3, rgb(255,170,0)),\
color-stop(0.85, rgb(222,133,0)) ); height: 28px; padding-top: 5px; \
padding-bottom: 5px; padding-left: 10px; padding-right: 10px; \
border-top-left-radius: 4px; border-top-right-radius: 4px; \
border-bottom-left-radius: 4px; border-bottom-right-radius: 4px;" \
type="button" onclick="alert("lelele");"><span style="color: #fff;">\
Button</span></button>');

我搜索了网页，然后我尝试了最简单的解决方案：提醒功能，甚至无法正常工作。

Answer 1

问题在于逃避......

onclick="alert(\'lelele\');"

但我更喜欢使用委托活动

 $(function(){
  $('.something').on('click','button',function(){
     alert('lelele');
  })
 });

这不需要内联的onclick javascript事件，这很难读取和调试......

从按钮

中删除onclick="alert("lelele");"

Answer 2

您的报价不匹配，请尝试逃避内部报价。

onclick="alert(\'lelele\');"

也就是说，onclick是旧的做事方式，你会得到更清晰的代码，避免使用内联JavaScript（比如bipen建议）。

$(".something")
    .append('<button class="myClass">Button</button>') // no CSS or inline JavaScript
    .on("click", "button", function() { // delegation syntax
        alert("lalala");
    });

Read more about event delegation syntax here

还可以将样式移动到css文件中！：）

Answer 3

在onclick参数中使用简单引号。您必须转义它们，因为您在追加函数中将它们用作分隔符。

onclick="alert(\'lelele\');"

按钮标签onclick无法正常工作

3 个答案: