index.html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<BODY>
<h5>可编辑的下拉列表</h5>
<table cellspacing=0 cellpadding=0>
<tr>
<td align='right'>
<span>
<input type='text' id='searchTxt' style='width:120pt;'>
</span>
</td>
<td align='left'>
<span style='width:15pt;'>
<select id='phone' name='phone' style='width:135pt;margin-left:-122pt;overflow:hidden;' onchange='searchTxt.value=this.value;'>
<option value='-1'>请选择</option>
<option value='motorola'>摩托罗拉</option>
</select>
</span>
</td>
</tr>
</table>
<iframe id='resultFrame' frameBorder='0' style='width:133pt;height:100pt;overflow:hidden;' scrolling='auto'></iframe>
<script>
var searchTxt = document.all.searchTxt;
searchTxt.onkeyup = function(){
document.all.resultFrame.src = 'content.html';
}
</script>
</BODY>
</HTML>
content.html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<style>
table {
font-size:13px;
width:120pt;
}
.trMouseOver {
background-color:#6666FF;
}
.trMouseOut {
background-color:#FFFFFF;
}
</style>
</HEAD>
<BODY>
<table>
<tr onmouseover='trMouseOver(this);' onmouseout='trMouseOut(this);' onclick='trClick(this);'><td>XT200</td></tr>
<tr onmouseover='trMouseOver(this);' onmouseout='trMouseOut(this);' onclick='trClick(this);'><td>XT201</td></tr>
<tr onmouseover='trMouseOver(this);' onmouseout='trMouseOut(this);' onclick='trClick(this);'><td>XT202</td></tr>
<tr onmouseover='trMouseOver(this);' onmouseout='trMouseOut(this);' onclick='trClick(this);'><td>XT203</td></tr>
<tr onmouseover='trMouseOver(this);' onmouseout='trMouseOut(this);' onclick='trClick(this);'><td>XT204</td></tr>
<tr onmouseover='trMouseOver(this);' onmouseout='trMouseOut(this);' onclick='trClick(this);'><td>XT205</td></tr>
<tr onmouseover='trMouseOver(this);' onmouseout='trMouseOut(this);' onclick='trClick(this);'><td>XT206</td></tr>
<tr onmouseover='trMouseOver(this);' onmouseout='trMouseOut(this);' onclick='trClick(this);'><td>XT207</td></tr>
<tr onmouseover='trMouseOver(this);' onmouseout='trMouseOut(this);' onclick='trClick(this);'><td>XT208</td></tr>
<tr onmouseover='trMouseOver(this);' onmouseout='trMouseOut(this);' onclick='trClick(this);'><td>XT209</td></tr>
<tr onmouseover='trMouseOver(this);' onmouseout='trMouseOut(this);' onclick='trClick(this);'><td>XT210</td></tr>
<tr onmouseover='trMouseOver(this);' onmouseout='trMouseOut(this);' onclick='trClick(this);'><td>XT211</td></tr>
</table>
<script>
trMouseOver = function(obj){
obj.className = 'trMouseOver';
}
trMouseOut = function(obj){
obj.className = 'trMouseOut';
}
trClick = function(obj) {
alert(obj.childNodes[0].innerText);
parent.document.all.searchTxt.value = obj.childNodes[0].innerText;
parent.document.all.resultFrame.style.display='none';
}
</script>
</BODY>
</HTML>
分享到：
相关推荐
此外，为了模拟百度下拉框的用户体验，可能还需要实现搜索建议功能，即当用户在输入框中输入字符时，实时更新下拉框的内容，只显示匹配当前输入的选项。这通常涉及到TComboBox的OnEditChange事件和对用户输入的实时...
在实际操作中，使用Photoshop滤镜的步骤通常是：打开图像，选择滤镜菜单，然后从下拉列表中选取合适的滤镜效果。在应用滤镜之前，用户还可以预览效果，并可以随时调整参数或撤销操作。此外，滤镜效果还可以与其他...
- `Simple`: 可编辑，但没有下拉列表。 **C#示例：** ```csharp comboBox1.DropDownStyle = ComboBoxStyle.DropDownList; ``` #### 11. 使用DataGrid显示日期格式 当需要在DataGrid中显示日期格式时，可以通过SQL...
前两者分别允许编辑和仅提供列表选择，而`Simple`模式则允许编辑且没有下拉箭头，根据需求选择合适的样式可增强用户体验。 ### 技巧十一：DataGrid日期格式化 显示日期时，需注意数据库和前端之间的日期格式一致性...
- 测试所有交互式元素，如按钮、下拉列表等，确保它们的行为符合预期。 - 在JavaScript被禁用的情况下，检查网站是否仍然可以正常访问。 - 验证AJAX请求的成功与失败处理逻辑。 - **注意事项**：除了功能性测试外...
滤镜在Photoshop中扮演着至关重要的角色，它们能够改变图像的颜色、纹理、形状等属性，甚至可以模拟传统艺术媒介，如油画、素描或水彩画。在CS5版本中，滤镜库进一步得到增强，新增了许多功能和改进，使得滤镜的使用...
- **查询图书**：提供搜索框，支持按书名、作者等关键词模糊查询，或者通过下拉菜单选择排序条件，如按出版日期、作者姓名等进行排序。 3. **数据库交互**： Java中的JDBC（Java Database Connectivity）API用于...
- 学习如何利用搜索引擎优化（SEO）技术提高网站在百度等搜索引擎中的排名。 - 网站登录服务可以帮助提高网站的可见度，吸引更多访客。 ### 五、评分标准 1. **网页类型齐全**（30分）：评估学生是否完成了规定...
实例010 带下拉菜单的工具栏 实例011 可调整按钮位置的工具栏 实例012 浮动工具栏 实例013 根据表中数据动态生成工具栏 实例014 具有提示功能的工具栏 1.4 状态栏应用实例 实例015 带进度条的状态栏 实例016...
cc实例046 不规则按钮 2.2 EditBox 控件典型实例 cc实例047 为EditBox设置新的系统菜单 cc实例048 为EditBox控件添加列表选择框 cc实例049 多彩边框的编辑框 cc实例050 改变编辑框文本颜色 2.3 ListBox...
cc实例010 带下拉菜单的工具栏 cc实例011 可调整按钮位置的工具栏 cc实例012 浮动工具栏 cc实例013 根据表中数据动态生成工具栏 cc实例014 具有提示功能的工具栏 1.4 状态栏应用实例 ...
cc实例010 带下拉菜单的工具栏 cc实例011 可调整按钮位置的工具栏 cc实例012 浮动工具栏 cc实例013 根据表中数据动态生成工具栏 cc实例014 具有提示功能的工具栏 1.4 状态栏应用实例 ...
7.2.4 使用“有效性”下拉列表创建动态图表 199 7.2.5 在图表中使用动态区域 201 7.2.6 创建滚动图表 204 7.2.7 修改滚动条示例显示最近12个月 206 7.3 创建高级图表 206 7.3.1 温度计图表 206 7.3.2 ...
7.2.4 使用“有效性”下拉列表创建动态图表 199 7.2.5 在图表中使用动态区域 201 7.2.6 创建滚动图表 204 7.2.7 修改滚动条示例显示最近12个月 206 7.3 创建高级图表 206 7.3.1 温度计图表 206 7.3.2 ...
7.2.4 使用“有效性”下拉列表创建动态图表 199 7.2.5 在图表中使用动态区域 201 7.2.6 创建滚动图表 204 7.2.7 修改滚动条示例显示最近12个月 206 7.3 创建高级图表 206 7.3.1 温度计图表 206 7.3.2 ...
7.2.4 使用“有效性”下拉列表创建动态图表 199 7.2.5 在图表中使用动态区域 201 7.2.6 创建滚动图表 204 7.2.7 修改滚动条示例显示最近12个月 206 7.3 创建高级图表 206 7.3.1 温度计图表 206 7.3.2 ...
7.2.4 使用“有效性”下拉列表创建动态图表 199 7.2.5 在图表中使用动态区域 201 7.2.6 创建滚动图表 204 7.2.7 修改滚动条示例显示最近12个月 206 7.3 创建高级图表 206 7.3.1 温度计图表 206 7.3.2 ...