Sou*_*ika 34 javascript jquery json
我的任务是动态添加按钮到div ..这是我按照动态添加按钮的代码,但它不工作请给我一个解决方案
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
function test() {
var r = "$('<input/>').attr({
type: "button",
id: "field"
})";
}
$("body").append(r);
</script>
</head>
<body>
<button onclick="test()">Insert after</button>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
代码在页面加载时在div上附加按钮但不起作用
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
function test() {
var r=$('<input/>').attr({
type: "button",
id: "field"
});
test().append("#test");
}
</script>
</head>
<body>
<div id="test"></div>
<button id="insertAfterBtn" onclick="test()">Insert after</button>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
小智 45
您的追加行必须在您的test()函数中
编辑:
这是两个版本:
版本1:jQuery监听器
$(function(){
$('button').on('click',function(){
var r= $('<input type="button" value="new button"/>');
$("body").append(r);
});
});
Run Code Online (Sandbox Code Playgroud)
版本2:使用功能(如您的示例)
function createInput(){
var $input = $('<input type="button" value="new button" />');
$input.appendTo($("body"));
}
Run Code Online (Sandbox Code Playgroud)
注意:这个可以使用.appendTo或使用.append.
小智 7
动态添加动态按钮;
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
function newButtonClickListener() {
alert("Hello World");
}
function test() {
var r = $('<input/>').attr({
type: "button",
id: "field",
value: "New Button",
onclick: "newButtonClickListener()"
});
$("body").append(r);
}
</script>
</head>
<body>
<button onclick="test()">Insert after</button><br/>
</body>
</html>Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
144626 次 |
| 最近记录: |