使用 JQuery 选择选项时的警报下拉标签

Posted 2023-03-13

【中文标题】使用 JQuery 选择选项时的警报下拉标签

【英文标题】：Alert dropdown Label when option is selected using JQuery

【发布时间】：2015-09-21 15:32:00

【问题描述】：

我有一张td的表如下，

这里有 3 个下拉菜单，根据第一个下拉菜单显示第二个和第三个下拉菜单

Example: when Option 1 or Option 2 is selected from Solutions dropdown, then dropdown with projectslist ID get displayed and when Option 3 is selected then dropdown with projectlist ID get displayed.

    <td>
        <select name="solutions" id="solutions" style="width:210px;">
            <option value="0" label="--- Select Solution ---" selected="selected">--- Select Solution ---</option>
            <option value="1" label="Option 1">Option 1</option>
            <option value="2" label="Option 2">Option 2</option>
            <option value="3" label="Option 3">Option 3</option>
        </select>
    </td>
    <td >&nbsp;</td>
    <td><span style="line-height: 1.5;" id="solution_description">Select appropriate monitoring solution.</span>
    </td>
</tr>
<tr >
    <td>&nbsp;</td>
</tr>
<tr>
    <td ><strong>Project: </strong>
    </td>
    <td id="projectslist">
        <select name="project" id="project" style="width:210px;">
            <option value="0" label="--- Select a Project ---" selected="selected">--- Select a Project ---</option>
            <option value="1" label="Project 1">Project 1</option>
        </select>
    </td>
    <td id="projectlist" style="display:none;">
        <select name="project" id="project" style="width:210px;">
            <option value="0" label="--- Select a Project ---" selected="selected">--- Select a Project ---</option>
            <option value="2" label="Project 2">Project 2</option>
            <option value="3" label="Project 3">Project 3</option>
        </select>
    </td>

现在，我需要在选择项目时获得一个提醒项目标签

IE，选择项目1时，我需要警告987654324 @和如果选择了项目2，则需要警告987654325 @和等...

所以任何人都可以使用 Jquery 帮助我

【问题讨论】：

你在尝试什么吗？你搜索了吗？有大量文章解释了如何使用 javascript 或 jquery 完成这个简单的任务

@MarcosPérezGude，我很累，但我没有得到任何解决方案。你能帮我解决这个问题吗...

首先，你有重复的 ids（project 和 projectlist 至少是重复的）。使用这个 html 你会遇到很多冲突和问题。

@kiranKumar 你会喜欢 AnuglarJS。 JQuery 非常适合 DOM 操作，但是当涉及到带有数据绑定的更高级的 UI 流时，它仅次于许多客户端框架。就此而言，学习 AngularJS 或 BackboneJS 无疑是值得的。

@Guy 他不知道如何使用 javascript 进行开发。你认为他准备好学习骨干和棱角了吗？你疯了吗xD

【参考方案1】：

就像监听更改事件一样简单。如果你学习了“Javascript for dummies”的第一章，你可以在 5 分钟内完成。

使用 jQuery：

  $('#solutions').on('change', function(event) 
       alert("This is the value selected in solutions: " + $(this).val());
  );