In an out-of-the-box implementation of an MVC app using Bootstrap in Visual Studio 2013, there seems to be some javasvript that works on this element:
<li role="presentation" class="dropdown">
....
</li>
When that element is clicked, there is, somewhere, some JavaScript that changes the class in this element to:
<li role="presentation" class="dropdown open">
....
</li>
I want to augment/alter whatever script this is, but I can't find it. Or, I could also just create my own that works along side the existing script, but I can't figure out how to reference this element when it doesn't have an id. I'd rather not add my own id, as this list of li's is generated dynamically and I don't want to deal with referencing all the id's in the JavaScript.
How would I find the existing script that is making this change? OR How would I create my own script to handle the on-click?
Thanks!
答案 0 :(得分：2)
You can reference the open li using css class selector '.':
$(".dropdown.open")
this will give you the currently open dropdown.
Explanation:
'CSS selectors' allow you to select elements using CSS syntax. For example:
'#id' where the '#' indicates the following text is the id of the element.
'.class' allows you to select all elements by class, eg $(".dropdown") gives you all elements with class "dropdown". These can be combined ".dropdown.open" - all elements with both class dropdown and open
Never change the library directly, there's an event you can hook into:
$('#id_of_ul').on('shown.bs.dropdown', function () {
// do something...
})
http://getbootstrap.com/javascript/#dropdowns
Explanation:
.on is the jquery event hook to provide your own handler when something happens, eg: $("#id").on('click', function....
In this case, the event is called shown.bs.dropdown and is provided / raised by the twitter-bootstrap dropdown functionality.
To answer the explicit question of where to find the scripts, you can download from getbootstrap.com or, they'll be in your MVC project under Scripts\