Posts tagged: js

jquery动态添加html

今天写了一个jquery动态添加html的功能,发出来晒晒。

?View Code JAVASCRIPT
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
<title>用jquery动态添加删除html元素标签</title>
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
var spotMax = 3;
if($('div.spot').size() >= spotMax) {$(obj).hide();}
$("input#add").click(function(){addSpot(this, spotMax);
});
});
function addSpot(obj, sm) {
$('div#spots').append(
'<div class="spot">' +
'<input type="text" name="spot_title"  /> ' +
'<input type="text" name="spot_addr" /> ' +
'<input type="text" name="spot_url" /> ' +
'<input type="button" class="remove" value="Delete" /></div>')
.find("input.remove").click(function(){
$(this).parent().remove();
$('input#add').show();
});
if($('div.spot').size() >= sm) {$(obj).hide();}
};
</script>
</head>
<body>
<form action="test.php" method="post" name="asdf" id="asdf">
<div id="spots">
<input type="button" id="add" name="add" value="add" /><br />
</div>
<input type="button" name="Submit" value="Submit" id="send" />
</form>
<script type="text/javascript">
$('#send').click(function(){
alert('Demonstration Only: submit disabled');
});
</script>
</body>
</html>

WordPress Theme Design

Free Web Hosting