Jquery 動態循環輸出表格

時間 2021-01-29

標籤 javascript html java app ide spa htm 事件 rem 欄目 JQuery 简体版

原文原文鏈接

實現功能：javascript

一、有一個同窗叫我實現一個這樣的功能就像PHP，在表單中輸入數字，而後網頁就出現相應的數量；若是是PHP的話就簡單多了，Jquery實現仍是第一個，就開始狂的實驗，最後仍是實現了（知識點：Jquery建立節點、獲取表單的值、循環語句）html

Jquery代碼：java

$(function(){ide

$("#btn").click(function(){ //選擇ID爲btn的元素，添加點擊事件spa

var result = $("input[name='text']").val(); //獲取name爲'text的文本框的值，並定義爲變量resulthtm

$("div").remove(".abc"); //做用是：每次執行時就把含有.abc這個類的div刪除；事件

for(i=1;i<=result;i++){ //for循環，定i=1,每次循環就加1; 當i的值由1循環到等於result的值同樣時（即「文本框的name='text'的值」）就中止循環ip

var createobj = $("<div class='abc'>建立的節點</div>"); //把div定義爲變量createobjrem

$("body").append(createobj); //把createobj這個變量追加到html中的'body'裏

}

});

</script>

HTML代碼：

<body>

</body>

CSS代碼：

<style>

.abc {height:50px;width:50px; margin:20px;background:#ccc;}

</style>

-----上傳了源文件，有須要的本身下載下來看看吧！

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。