我如何应用Onselect方法在javascript中下拉菜单

Question

i am using twitter bootstrap to create a drop down menu, the menu contains 2 sub-menus as shown:

    <div class="Menu"">
    <div class="btn-group">
        <button type="button" id="someaction" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
            Select Action
  <span class="caret"></span>
        </button>
        <ul class="dropdown-menu">
            <li><a class="add">Add</a></li>
            <li><a class="remove">Remove</a></li>
        </ul>
    </div>
</div>

Using JavaScript how do i add actions to each sub menus, so for example when i select Add it should alert me "Add" and when i click remove it should alert me "Remove". I think if loop will do a job for me, for example if (Add is selected do this else if Remove is selected do something else .. i would like to use this to perform different actions based on sub menus

  $(".dropdown-menu li a").click(function () {

    });

Answer 1

The selector that you are using is perfectly alright, But since you are adding a click event to an anchor tag, You can optionally use .preventDefault() to prevent the page redirecting,

Just try,

$(".dropdown-menu li a").click(function (e) {
    e.preventDefault();
    alert($(this).text());
});

Note: you have to use .text() method to retrieve the text inside a tag.

DEMO

Answer 2

Simply write the following code inside your function

alert($(this).text());// returns the current element text

Example Fiddle

Answer 3

You can refer to the fiddle http://jsfiddle.net/9GZQ2/ and can do what you want to do. All you need to do is to change the tasks inside the function for you it will be: alert($(this).text());

$(function(){
    $("#ProducterType").change(function(){
       alert($(this).text());
    });
    $("#Role").change(function(){
       alert($(this).text());
    });
});