jquery().ready(function()选择框控制
时间: 2024-09-25 18:13:41 浏览: 31
jQuery的`.ready()`函数是一个预加载函数,它会在文档结构准备好并且所有相关的外部资源(如CSS和JavaScript文件)已经完成加载之后执行提供的回调函数。当需要对页面元素进行操作,特别是处理DOM(文档对象模型)时,常常会用到这个功能。
例如,当你想要控制一个选择框(select box),可以在`.ready()`函数内部编写这样的代码:
```javascript
$(document).ready(function(){
// 获取选择框元素
var selectBox = $("#mySelect");
// 监听选择框的变化事件
selectBox.change(function(){
var selectedOption = $(this).val(); // 获取选中的选项值
console.log("Selected option:", selectedOption);
// 根据选项值执行相应操作
if(selectedOption == 'option1'){
// 执行与option1相关的操作
} else if(selectedOption == 'option2') {
// 执行与option2相关的操作
}
});
});
```
在这个例子中,`#mySelect`是选择框的ID,`.change()`方法用于监听用户的选择变化。`.ready()`确保了DOM元素已经可以被操作,避免了在文档尚未完全加载完毕时尝试获取元素导致的问题。