如果使用 jquery 选择下拉项,则显示表单字段

2023-12-06

我正在尝试创建一个下拉字段,如果选择“其他”项目,则会出现“请指定”文本框。下面的代码仅适用于一个下拉选择字段,但是一旦我添加第二个选择字段,它就不再起作用。

这是我所拥有的似乎不起作用的内容:

CSS...

#techother{display:none;}
#lmsother{display:none;}

Body...

<p>Chose Your Browser: <select name = "Browser" required>
        <option value = "">-- Select an Option --</option>
        <option value = "1">IE</option>
        <option value = "2">FF</option>
        <option value = "3">Safari</option>
        <option value = "4">Opera</option>
        <option value = "5">Other</option>
        </select>
    </p>
  <div id="browserother">
    <p>Please Specify: <label id="browserlabel"><input name="Other Browser" type="text" placeholder="Other Browser" size="50" /></label></p>
    </div>

    <p>Operating System: <select name = "OS" required>
        <option value = "">-- Select an Option --</option>
        <option value = "Win">Windows</option>
        <option value = "ios">iOS</option>
        <option value = "otheros">Other</option>
        </select>
    </p>
  <div id="osother">
    <p>Please Specify: <label id="oslabel"><input name="Other OS" type="text" placeholder="Other OS" size="50" /></label></p>
  </div>

脚本...

  <script>
$('form select[name=Browser]').change(function(){
  if ($('form select option:selected').val() == '5'){
    $('#browserother').show();
  }else{
    $('#browserother').hide();
  }
});

$('form select[name=OS]').change(function(){
  if ($('form select option:selected').val() == 'otheros'){
    $('#osother').show();
  }else{
    $('#osother').hide();
  }
});
</script>

有办法让这个工作吗?谢谢!


试试这个演示:http://jsfiddle.net/2pM3n/1/

$('select[name=Browser]').change(function () {
    if ($(this).val() == '5') {
        $('#browserother').show();
    } else {
        $('#browserother').hide();
    }
});

$('select[name=OS]').change(function () {
    if ($(this).val() == 'otheros') {
        $('#osother').show();
    } else {
        $('#osother').hide();
    }
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如果使用 jquery 选择下拉项,则显示表单字段 的相关文章

随机推荐

  • 用于命名空间扩展的图标覆盖处理程序

    我正在开发命名空间扩展 它提供服务器上文件的虚拟视图 在此视图中 我需要使用覆盖图标提供文件的不同状态 正在使用 离线 不同步等 我阅读了实现覆盖处理程序的文章 并认为我将尝试在我们的覆盖处理程序之一中处理此问题 该处理程序实现 IShel
  • 如何使用Cookie检查用户是否已经登录?

    我想知道如何检测用户是否已经登录 使用cookie 我没有使用任何登录控件 我有一个数据库可以检查 ID 和 PWD 另请告诉我是否可以在不使用 cookie 的情况下完成 任何代码或链接都会有帮助 网络配置
  • Android 下拉颜色选择器

    我想创建一个下拉颜色选择器 如下所示 抱歉图像丑陋 我只需要一些颜色 比方说 6 种 所以我不需要完整的颜色选择器 下拉菜单就可以正常工作 我知道我必须扩展 Spinner 的阵列适配器并覆盖获取下拉视图 and getView 我不知道的
  • 如何从一个文件中读取随机行?

    有内置方法可以做到这一点吗 如果不是 我怎样才能在不花费太多开销的情况下做到这一点 不是内置的 而是算法R 3 4 2 Waterman 的 Reservoir Algorithm 来自 Knuth 的 计算机编程的艺术 很好 非常简化的版
  • 如何从父子表中获取结果

    Work on SQL服务器 我的表结构如下 CREATE TABLE dbo AgentInfo AgentID int NOT NULL ParentID int NULL CONSTRAINT PK AgentInfo PRIMARY
  • 运行命令、流式传输 stdout/stderr 并捕获结果

    我正在尝试使用std process Command运行命令并流式传输其 stdout 和 stderr 同时捕获 stdout stderr 的副本 我发现我可以使用spawn 此代码将捕获输出 但不会在发生时将其流式传输到 stdout
  • 如何修复“没有名为‘app_one’的模块”

    我有一个具有以下结构的 Python 包 gt python package package root directory gt app one subpackage directory gt init py gt views py gt
  • Adobe Air:在不同应用程序之间更改焦点时滚动条会抛出错误

    TypeError Error 1009 Cannot access a property or method of a null object reference at spark components Scroller focusInH
  • 如何平滑 CamShift 中的跟踪

    我正在使用 OpenCV 库函数进行手头跟踪项目 通过使用Camshift 我可以跟踪我的手 但它不稳定 即使我使我的手稳定 跟踪也几乎没有移动 所以我无法在正确的位置执行鼠标单击操作 有人请帮我解决这个问题 void TrackingOb
  • 复制时的 PouchDB/CouchDB 序列计数器

    I am live将新创建的 pouchdb 3 3 1 同步到已建立的 iris couchdb 初始复制成功发生 pause事件被触发 If I do info 在本地 我得到的 update seq 为362 如果我做info 在遥控
  • 如何将c++与字边界匹配

    我想将单词 c 与 Python 3 中的单词边界匹配 但我的猜测是 b 也会在加号上触发 为了清楚起见 我已简化为以下测试用例 bc b 我希望我可以保留单词边界 但以某种方式更改其设置 原因是我想将正则表达式放在 TfidfVector
  • 点语法和方括号语法有什么区别?

    我正在经历一些 Objective C 的演练 其中很多地方都让我大吃一惊 我很想把他们打倒 消息发送和方法调用有本质区别吗 Objective C 让我可以同时完成这两件事 object message产生相同的结果 object mes
  • 如何使用 MediaCodec、MediaExtractor 或 MediaMetadataRetriever 确定视频文件的帧速率?

    如何提取录制视频文件的帧速率 我知道有 MediaFormat KEY FRAME RATE 并且我可以通过 MediaExtractor 访问 MediaFormat 对象 但是 KEY FRAME RATE 仅适用于编码器 相反 我想找
  • 将自定义按钮与 Inno Setup 取消按钮对齐

    我在设置与顶部尺寸相同的按钮时遇到问题Cancel我使用时按钮WizardSizePercent 150 in the Setup部分 这是我的代码 AboutButton TNewButton Create WizardForm Abou
  • 在不同情况下与其他单位相比,百分比的真正作用如何

    所以基本上我最近一直在尝试 CSS 并且发现了一些对我来说似乎很新的东西 在设置元素的填充时 我通常使用 em 或 px 等单位 但这次我尝试使用百分比 令我惊讶的是它的工作方式与其他单位非常不同 所以我设置了三种不同的情况 body ma
  • 如何在 Python 中声明数组并将其添加到数组中

    我正在尝试将项目添加到Python 中的数组中 I run array 然后 我尝试通过执行以下操作向该数组添加一些内容 array append valueToBeInserted 似乎没有一个 append方法用于此 如何将项目添加到数
  • 如何以编程方式确定“写入”系统调用对特定文件是否是原子的?

    在某些情况下 编码器不能依赖系统调用是原子的 例如如果文件位于 NFS 文件系统上 参见NFS 概述 常见问题解答和 HOWTO 文档 但大多数数据库工作最终都需要原子系统调用 参见数据库系统的原子性 是否有一种标准 且独立于操作系统 方法
  • 使用 Blob 在 SQLite 中存储字节数组

    对于我的应用程序 我尝试在 SQLite 应用程序中存储字节数组 我以这种方式填充 SQLite 数据库 public bool InsertMessage create string SQl and fill it with the SQ
  • c# foreach(对象中的属性)...有没有一种简单的方法可以做到这一点?

    我有一个包含多个属性的类 如果有任何区别 所有属性都是字符串 我还有一个列表 其中包含该类的许多不同实例 在为我的类创建一些单元测试时 我决定要循环遍历列表中的每个对象 然后循环遍历该对象的每个属性 我以为这样做会很简单 foreach O
  • 如果使用 jquery 选择下拉项,则显示表单字段

    我正在尝试创建一个下拉字段 如果选择 其他 项目 则会出现 请指定 文本框 下面的代码仅适用于一个下拉选择字段 但是一旦我添加第二个选择字段 它就不再起作用 这是我所拥有的似乎不起作用的内容 CSS techother display no