欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

使用JQuery制作簡易留言板

 更新時間：2016年05月23日 15:36:51   作者：氣氛組.  
這篇文章主要為大家詳細(xì)介紹了如何使用JavaScript和JQuery制作簡易留言板功能，文中的示例代碼講解詳細(xì)，有需要的小伙伴可以參考一下

運(yùn)行效果

HTML代碼

<textarea name="" id="text'"></textarea><span id="info"></span>
		<br>
		<button>發(fā)布</button>
		
		<ul>

		</ul>

css代碼

<style>
			* {
				margin: 0;
				padding: 0;
			}

			body {
				padding: 100px;
			}

			textarea {
				width: 200px;
				height: 100px;
				border: 1px solid gainsboro;
				outline: none;
				resize: none;
			}

			ul {
				margin-top: 50px;
			}

			li {
				width: 300px;
				padding: 5px;
				background-color: rgb(198, 198, 198);
				color: black;
				font-size: 14px;
				margin: 15px 0;
			}

			li a {
				float: right;

			}

			li a:hover {
				color: red;
			}

			#info {
				font-size: 10px;
				color: red;
			}
		</style>

JS代碼

			$("button").on('click', function() {
				if($('textarea').val() == ""){
					$('span').html('asd')
					return;
				}
				var li = $('<li></li>')
				li.html($('textarea:first').val())
				li.append('<a href="javascript:;">刪除</a>')
				$('ul').prepend(li)
				$('textarea:first').val('')
			})
			$('ul').on('click', 'a', function() {
				$(this).parent('li').remove()
			})

以上就是使用JQuery制作簡易留言板的詳細(xì)內(nèi)容，更多關(guān)于JQuery留言板的資料請關(guān)注腳本之家其它相關(guān)文章！

相關(guān)文章

最新評論