javascript - 如何在html中从列表中设置选定的值

Question

<ul>
    <li class="first"><a href="#">Modify search</a>

    </li>
    <li><a href="#">For <span>Select</span><span style="float:right; padding-right:10px;">▼&lt;/span></a>

        <ul> <span><a href="#">Girlfriend</a></span>  <span><a href="#">Boyfriend</a></span>  <span><a href="#">Husband</a></span>  <span><a href="#">Wife</a></span> 
            <span class="cl"></span> <span><a href="#">Mother</a></span>  <span><a href="#">Father</a></span>  <span><a href="#">Daughter</a></span>  <span><a href="#">Son</a></span> 
                <span class="cl"></span> <span><a href="#">Friend (M)</a></span>  <span><a href="#">Friend (F)</a></span>  <span><a href="#">Colleague (M)</a></span>  <span><a href="#">Colleague (F)</a></span> 
                    <span class="cl"></span> <span><a href="#">Nephew</a></span>  <span><a href="#">Niece</a></span>  <span><a href="#">Aunt</a></span>  <span><a href="#">Uncle</a></span> 
                        <span class="cl"></span>
        </ul>
    </li>
</ul>

我想要做的是每当我选择任何值时，它必须突出显示，并且应该显示在过滤器中。

例如，如果我选择女朋友 For : select 应该看起来像 For : girl

Answer 1

$('a').click(function(){

  var clicked_link = $(this).text() // will get the text 
  $(this).attr('some_attr') // will get the value of an attribute in the clicked a tag

alert(clicked_link);
})

Answer 2

为 span 添加 id<span id="this">Select</span>

然后getElementByI("this").innerHTML =设置为你想要的东西

Answer 3

让我猜猜“Select”文本有id“select_id”；

$('ul span').click(function(){

$("#select_id").html($(this).html);



});

Answer 4

将id属性添加getval到要显示所选项目的范围。

<span id="getval" style="float:right; padding-right:10px;">&#x25BC;</span>

jQuery

获取文本，anchor然后将其设置为您要显示的位置。

$(document).ready(function(){
   $("ul span a").click(function(){
      $("#getval").text($(this).text());
   });
});

Answer 5

如果您可以为元素分配ID会更容易...

例如：

<a href="#">For <span id="select">Select</span>...

还有第二个ul：

<ul id="list">...

那么你需要这样的东西：

$('#list a').on('click', function() {
   var text = $(this).text(); //this take the text of the clicked text.
   $('#select').empty().text(text); //this assign the value.
});

Answer 6

像这样做

$(function(){
 $("a").click(function() {
    alert("look like for : "+$(this).text());// OR show this value in any particular DIV
    $(".displayDiv").text("look like for : "+$(this).text());
  });
});

Answer 7

你应该只有li在 aul而不是跨度。其他人是不允许的。

但是，您可能正在寻找的答案是：

$('ul li ul span').click(function(){

     $('ul li span').eq(2).text($(this).text());

}

所有这一切肯定都需要使用一个类或 id。