JavaScript基础案例代码
-
文本显示及隐藏
鼠标离开文本框时，失去焦点，文本若为空，默认文字出现
鼠标点击文本框时，获得焦点，文本框中默认文字消失
代码：
<script>
window.onload = function () {
var input = document.getElementsByTagName('input')[0]
input.onfocus = function () {
if (input.value === "来啊,造作啊") {
input.value = " "
}
}
input.onblur = function () {
//有个空格
if (input.value === " ") {
input.value = "来啊,造作啊"
}
}
}
</script>
<input type="text" value="来啊,造作啊">
- 发送消息及删除事件
将文本文本框的内容发送到其他地方，发送后文本框清空
<body>
<textarea name="" id="mytext" cols="30" rows="10"></textarea>
<button>发布</button>
<ul id="myul">
</ul>
<script>
$(function () {
var btn = document.getElementsByTagName("button")[0]
btn.onclick = function () {
var mytext = document.getElementById('mytext').value
var myul = document.getElementById('myul')
myul.innerHTML += `
<li>${mytext} <a id="del οnclick="del">删除</a></li>
`
document.getElementById('mytext').value = ""
}
// 删除事件1 动态添加的标签中若是有onclick，可以直接用
// 1.onclick事件
// function del(obj) {
// var delli = obj.parentNode
// var delul = delli.parentNode
// delul.removeChild(delli)
// }
// 删除事件2 动态添加的标签中若是有id，绑定点击事件
$("#myul").on('click', '#del', function () {
$(this).parent().remove()
})
})
</script>
</body>```
2981
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
