javascript - 基础下拉选择值

标签 javascript jquery zurb-foundation

我有一个如下所示的基础下拉列表

<a href="#" data-dropdown="drop1" id="dateTitle">Date Range  </a>
<ul id="drop1" class="f-dropdown small date-menu" drop-down-content>
    <li id="custom">Custom</li>
    <div id="customContainer"></div>
    <li id="today"> Today</li>
    <li id="yesterday">Yesterday</li>
    <li id="sundaytoToday">This Week(Sun-Today)</li>
    <li id="montoToday">This Week(Mon-Today)</li>
    <li id="lastSevenDays">Last 7 Days</li>
    <li id="lastSuntoSat">Last Week(Sun - Sat)</li>
    <li id="lastMontoSun">Last Week(Mon - Sun)</li>
    <li id="lastBusinessWeek">Last Business Week(Mon - Fri)</li>
    <li id="lastFourteenDays">Last 14 days</li>
    <li id="thisMonth">This Month</li>
    <li id="lastThirtyDays">Last 30 days</li>
    <li id="lastMonth">Last Month</li>
    <li id="allTime">All Time</li>
    <hr>
    <li id="compare">Compare
        <div class="onoffswitch">
            <div class="onoffswitch">
            <input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="myonoffswitch">
            <label class="onoffswitch-label" for="myonoffswitch">
            <div class="onoffswitch-inner"></div>
            <div class="onoffswitch-switch"></div>
        </label>
    </div>
    </li>
    <div id="extraContainer"></div>
    <div align="center"><button class="date-picker-submit">Apply</button></div>
</ul>

当用户单击列表项,然后单击底部的“应用”按钮时,我想抓取列表中选定的项

我不知道该怎么做

$('.date-picker-submit').click(function(){
  //get the selected value
});

最佳答案

这样做:

$('#drop1 li').click(function(){
     $('#drop1 li').removeClass("selected");
     $(this).addClass("selected");
});

现在点击按钮:

$('.date-picker-submit').click(function(){
    $('#drop1 li.selected').text();
});

关于javascript - 基础下拉选择值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23685660/

相关文章:

javascript - 最佳实践——创建具有 3 列的 Bootstrap 模板——左侧和右侧边栏

javascript - 大家好,如何增加数组对象中存储的状态值

javascript - 将表格放入 Bootstrap 弹出窗口

node.js - 在多台机器上使用 Foundation-CLI/Gulp

php - 在javascript中使用PHP变量

javascript - Twitter typehead.js 显示整个查询,而不仅仅是值

javascript - 无需复制/粘贴即可调整大小和加载的 jQuery 函数

javascript - 将模型类型设置为主干中具有外部 url 的集合

ruby-on-rails - 如何使用 Rails 5.1.0 和 jQuery

javascript - Foundation Abide - 如果先前的输入无效,则在有效输入上触发无效错误