`
yeluowuhen
  • 浏览: 156868 次
  • 性别: Icon_minigender_2
  • 来自: 北京
社区版块
存档分类
最新评论

下拉框的简单联动

 
阅读更多

页面代码:

<tr>
<td>
系统一的IP:
<select name="re_address" id="reserve_address" onchange="getbp()"> 
  <option value="">请选择</option> 
      <option value="10.210.213.226">环境一</option>  
      <option value="10.210.214.134">环境二</option>  
        </select>
</td>
</tr>
<tr>
<td>
系统的IP:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<select name="bp_address" id="bp_address">
      <option value="">请选择</option> 
    </select>
</td>
</tr>

script:

 

function getbp(){

         var reserve=$('#reserve_address');

         if(reserve.val()=="10.210.213.226")

         {

          $("#bp_address option:[value='10.210.214.135']").remove();

          $('#bp_address').append("<option value='10.210.213.224'>bp环境一</option>");

}    

         else if(reserve.val()=="10.210.214.134")

         {

          $("#bp_address option:[value='10.210.213.224']").remove();

          $('#bp_address').append("<option value='10.210.214.135'>bp环境二</option>");

         }

         

     }

 

jquery的资料:http://wenku.baidu.com/view/1980570416fc700abb68fcc4.html

分享到:
评论

相关推荐

    Extjs 轻松实现下拉框联动

    最近小弟做了Extjs实现实现下拉框联动的效果,参考了好久才学会,闲下来发一个简单的例子。。呵呵

    最简单的下拉框联动不刷新页面示例

    在本示例中,“最简单的下拉框联动不刷新页面”是通过AJAX技术实现的。 AJAX(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。它通过在后台与服务器交换数据并...

    C#省份城市下拉框联动简单实现方法

    在C#编程中,省份城市下拉框联动是一种常见的用户界面交互设计,它允许用户从一个下拉框(比如省份)中选择一个选项后,另一个下拉框(比如城市)会自动更新为与所选省份相关联的城市。这种功能常见于地址输入、物流...

    省市下拉框二级联动完成版(调试通过)

    ### 知识点:省市下拉框二级联动完成版(调试通过) #### 一、概述 在Web开发中,为了提供更好的用户体验与交互性,常常需要实现省市等地理位置的二级联动选择功能。所谓的“二级联动”指的是用户在选择了某个地区...

    JQuery 年月日三级下拉框联动

    一个直制的JQuery 年月日三级下拉框联动 使用方法非常简单 &lt;title&gt;JQuery 年月日三下拉框联动 &lt;script src="jquery-1.4.2.min.js" type="text/javascript"&gt;&lt;/script&gt; ...

    xml城市下拉框联动

    在"xml城市下拉框联动"这个场景中,我们主要探讨如何利用XML来实现前端交互中的城市选择下拉框的联动效果。 首先,我们需要理解下拉框联动的基本概念。联动下拉框是指两个或多个下拉框之间存在关联关系,当用户在一...

    下拉框联动实例 HTML

    在下拉框联动实例中,CSS可能用来调整下拉框的样式,如宽度、颜色、字体等。例如: ```css select { width: 150px; font-size: 14px; } ``` 最后,JavaScript是实现动态效果的关键。通过监听省份下拉框的`change...

    Js实现下拉框联动按钮(静态)

    ### Js实现下拉框联动按钮(静态) 在前端开发中,常常会遇到需要根据用户的选择动态更新页面元素的情况。其中一个常见的需求就是实现下拉框之间的联动以及与按钮的交互。这种场景常见于表单设计中,例如:选择省份...

    下拉框二级联动

    在网页设计中,"下拉框二级联动"是一种常见的交互设计模式,主要用于处理层次结构的数据展示,例如地区选择、分类导航等。这种设计通常涉及到两个或多个下拉框,其中第二个下拉框的内容会根据第一个下拉框的选择动态...

    html年月日三下拉框联动

    本文将详细解析一个简单的HTML年月日三下拉框联动的代码示例,帮助读者理解其工作原理并掌握其实现方法。 #### 核心知识点 1. **下拉框(Select)元素**:在HTML中,`&lt;select&gt;`标签用于创建一个下拉列表。用户可以...

    下拉框三级联动

    简单的下拉框三级联动网页设计,有效学习html

    简单的vue三级联动下拉框代码

    本示例中提到的"简单的vue三级联动下拉框代码"是Vue.js应用场景的一个常见实例,常用于构建复杂的表单组件,如地区选择、商品分类筛选等。 一、Vue.js 三级联动下拉框基础概念 1. Vue.js:Vue.js 是一套用于构建...

    实时监控input框,实现输入框与下拉框联动的实例

    "实时监控input框,实现输入框与下拉框联动的实例" 本文讲述了如何使用HTML、JQuery和PHP技术来实现实时监控input框,实现输入框与下拉框联动的实例。该实例可以在实际项目中应用,具有很好的参考价值。 一、HTML...

    无限级下联动下拉框

    总结来说,AdSelect是Asp.Net 2.0平台下实现无限级下联动下拉框的强大工具,它的部署简单,使用灵活,能有效地提升用户体验并简化开发者的工作。无论是新手还是经验丰富的开发者,都可以快速上手并将其应用到实际...

    layui实现下拉框三级联动

    在本文中,我们将深入探讨如何使用layui框架实现下拉框的三级联动效果。layui是一款流行的前端组件库,它提供了丰富的UI元素和交互功能,适用于快速构建美观且响应式的Web应用。下拉框三级联动通常用于地理信息选择...

    DWR+Spring下拉框联动实例

    **DWR+Spring 下拉框联动实例** DWR(Direct Web Remoting)是一个开源的Java框架,它使得JavaScript和服务器端的Java代码可以进行实时交互,实现AJAX(Asynchronous JavaScript and XML)功能,而无需编写复杂的...

    js实现下拉框二级联动

    下拉框二级联动技术是一种在网页上常用的交互方式,它可以根据用户在一级下拉框中的选择动态改变二级下拉框中的选项内容。本文详细介绍了如何使用JavaScript实现下拉框二级联动功能,提供了具体的代码实现以及相关...

    JS实现的简单下拉框联动功能示例

    在JavaScript编程中,下拉框联动是一种常见的交互功能,它允许用户在选择一个下拉框选项后,根据选择自动更新另一个下拉框的选项。这种功能通常用于提供筛选或者关联数据的选择,例如地区与城市之间的关系。在这个...

    javascript实现二级联动下拉框.docx

    描述:JavaScript 实现二级联动下拉框是一个简单且基本的下拉框联动示例,主要针对只有二级联动且第一级是固定的选项,第二级的内容也比较简单。 标签:JavaScript、下拉框、联动、select 对象 部分内容: ### ...

Global site tag (gtag.js) - Google Analytics