我想将文本添加到现有的DIV,当我点击与ID#将按钮。 但是,这是行不通的。
在这里我的代码:
$(function () { $('#Add').click(function () { $('<p>Text</p>').appendTo('#Content'); }); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div id="Content"> <button id="Add" /> </div>
我希望你能帮助我。
您需要定义按钮文本,并有按钮的有效HTML。 我也建议使用.on
了按钮的点击处理程序
$(function () { $('#Add').on('click', function () { $('<p>Text</p>').appendTo('#Content'); }); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div id="Content"> <button id="Add">Add Text</button> </div>
另外我想确保jQuery是在页面的只是收盘前底部</body>
标签。 这样做将会使它所以你不必有包裹在整个事情$(function
,但我仍然会做到这一点。在页面的结尾有你的JavaScript负载使得它如此加载页面的其余部分柜面有一个在JavaScript减缓地方。
HTML
<div id="Content">
<button id="Add" value="Add" />
</div>
如果你想BUTTOM后
$(function () {
$('#Add').click(function () {
$('#Content').after('<p>Text</p>');
});
});
或之前
$(function () {
$('#Add').click(function () {
$('#Content').before('<p>Text</p>');
});
});
你的HTML是无效的button
是不是空标签。 尝试
<div id="Content">
<button id="Add">Add</button>
</div>
我们可以通过添加按钮的功能做的更简单的方法等,并在点击我们呼吁追加该功能。
<div id="Content">
<button id="Add" onclick="append();">Add Text</button>
</div>
<script type="text/javascript">
function append()
{
$('<p>Text</p>').appendTo('#Content');
}
</script>
很容易从我身边: -
<html>
<head>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script>
$(document).ready(function() {
$("input").click(function() {
$('<input type="text" name="name" value="value"/>').appendTo('#testdiv');
});
});
</script>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<div id="testdiv"></div>
<input type="button" value="Add" />
</body>
</html>