ul li $(this).text()没有显示任何内容

时间:2016-03-07 10:38:12

标签: javascript jquery twitter-bootstrap

解决了!实际上问题出在$(document).ready(function(){//});使用它之后,它运行良好。谢谢你的帮助,抱歉因为这个愚蠢的错误。

我正在尝试从bootstrap下拉菜单中选择li。它有效,但是当我想获得所选择的li的文本时,它什么也没有显示。

<div class="btn-group">
    <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
        <font id="dropdownMenu" >inch</font>
        <span class="caret"></span>
    </a>
    <ul id="dropdownList" class="dropdown-menu">
        <li><a href="#">inch</a></li>
        <li><a href="#">cm</a></li>
        <li><a href="#">mm</a></li>
    </ul>
</div>

JS:

$('#dropdownList li').click(function () {
    console.log($(this).text());
    document.getElementById('dropdownMenu').innerHTML = $(this).text();
});

我可以知道它为什么不起作用吗?

谢谢!

3 个答案:

答案 0 :(得分:0)

获取内部锚标记的文本。这是带文字的元素。

import pandas
from sqlalchemy import create_engine

engine = create_engine(
   'postgresql://user:pass@server.com/weatherhist?port=5439',
)

query = """
        select *
        from rainy_days
        where year=’2010’ and day=‘weekend’
        """
df = pandas.read_sql(query, con=engine)

答案 1 :(得分:0)

使用Jquery:

JSFiddle

$('#dropdownList li').click(function () {
    console.log($(this).text());
    $('#dropdownMenu').text($(this).text());
});

答案 2 :(得分:0)

您应该尝试限制DOM读/写,例如使用.find().text()等。我会在标记中添加一些数据

HTML:

<ul id="dropdownList" class="dropdown-menu">
  <li data-value="inch"><a href="#">inch</a></li>
  <li data-value="cm"><a href="#">cm</a></li>
  <li data-value="mm"><a href="#">mm</a></li>
</ul>

JS:

$('#dropdownList li').click(function () {
  console.log($(this).data('value'))
})

<强> Working Demo

两件事:

  • data-*是有效的HTML5代码,可用于满足您的需求。
  • 请勿针对每次点击var dropdownValue = $('#value')重新阅读DOM。