Question

我正在使用基础下拉

你可以在这看一下：

http://foundation.zurb.com/docs/components/dropdown.html#

我使用以下代码

创建了一个下拉列表

<a href="#" data-dropdown="drop1" >Date Range  </a>
    <ul id="drop1" class="f-dropdown large date-menu" drop-down-content>
        <li id="custom">Custom</li>
        <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>
     </ul>

我想获取所选元素的值/ id

我尝试过如下，但它无法正常工作

$('#drop1').click(function(){
  var ss=$('#drop1').val();
  console.log(ss);  
});

我是编程任何帮助的新手。

提前致谢

更新：如何关闭点按下拉列表？

Answer 1

您需要.text()或.html()而不是.val()。

.val()适用于input, select, radio, checkbox等表单元素。

$('#drop1 li').click(function(){
  var ss = $(this).text(); //this refers to current element clicked here.
  //to get id
  var id = this.id;
  console.log(ss, id);  
});

“this” Keyword

Answer 2

这里是更正

    $('#drop1 li').click(function(){
      var id=$(this).attr('id');//to get id of clicked element
      console.log(id);  
var h=$(this).text();//to get text of clicked element
      console.log(h);  
    });

<强>更新

    $('#drop1 li').click(function(){
          var id=$(this).attr('id');//to get id of clicked element
          console.log(id);  
    var h=$(this).text();//to get text of clicked element
          console.log(h);  
    $(this).parent().fadeOut(300);
$('.open').removeClass('open');
        });

Answer 3

根据doc，类open会添加到所选元素中。您可以使用以下方式进行选择：

 $('#drop1').click(function(){
   var ss=$('this).find('.open').html();
   console.log(ss);  
 });

在基础下拉列表中获取选定的列表值

3 个答案: