`

jQuery练习六

jQueryHTML 
阅读更多

ex-6.html 


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Untitled Document</title>
		<script type="text/javascript" src="scripts/jquery-1.4.2.js"></script>
		<script type="text/javascript">
		$(function(){
			
			function setFileCount() {
				$(".fileCount").each(function(index){
					$(this).text('附件' + (index + 1)) ;
				}) ;
			}
			
			$("#addFile").click(function(){
				$("<tr></tr>").append("<td class='fileCount'></td>")
							  .append($("<td><input type='file' name='file'><button>Delete</button></td>"))
							  .insertBefore("#content")
							  .find("button")
							  .click(function(){
							  	$(this).parent().parent().remove() ;
								setFileCount() ;
							  }) ;
				
				setFileCount() ;
				return false ;
				});
			}) ;
			
			
		</script>
		
    </head>
    <body>
        <form name="mailForm" method="post" action="/javamail/mail.do" enctype="multipart/form-data">
            <table>
                <tr>
                    <td>
                        主题:
                    </td>
                    <td>
                        <input type="text" name="subject" value="">
                    </td>
                </tr>
                <tr>
                    <td>
                        收件人:
                    </td>
                    <td>
                        <input type="checkbox" name="mailTo" value="hello@itcast.cn">hello
						<input type="checkbox" name="mailTo" value="test@itcast.cn">test
						<input type="checkbox" name="mailTo" value="abc@itcast.cn">abc
						<input type="checkbox" name="mailTo" value="msn@itcast.cn">msn
                    </td>
                </tr>
                <tr>
                    <td class='fileCount'>
                        附件1:
                    </td>
                    <td>
                        <input type="file" name="file" value="">
                        <button id="addFile">
                            AddFile
                        </button>
                    </td>
                </tr>
                <tr id="content">
                    <td>
                        邮件内容:
                    </td>
                    <td>
                        <textarea name="content">
                        </textarea>
                    </td>
                </tr>
                <tr>
                    <td colspan="2">
                        <input type="submit" value="Submit">
                    </td>
                </tr>
            </table>
        </form>
    </body>
</html>

分享到：
| jQuery练习五
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics