我有 10 个 (ul) block ，它们是使用 $windows.onLoad 动态构建的，在每个 block 中我都有术语列表 (li)。每个 block 中的某些术语最初必须是不可见的。我只在脚本中使用 jQuery 选择器执行所有操作。
window).load(function () {
$.ajax({
url: '@controllers.blog.routes.BlogController.allBlogTerms()',
type: 'get',
success: function (terms) {
var urlPrefix = "@translateUrl(controllers.blog.routes.BlogController.termItem("").url)";
for (var l = 0; l < terms.length; l++) {
$('.list_of_terms').append('<div class="item col-md-4">\
<div class="inner_item">\
<div class="capital">\
' + terms[l].letter + '\
</div>\
<ul class="ul' + l + '">\
</ul>\
</div>\
</div>\
<div class="clearfix"></div>');
for (var t = 0; t <= terms[l].terms.length - 1; t++) {
if (t > 5)
$('.ul' + l).append('<li style="display:none;"><a href="' + urlPrefix + terms[l].terms[t].url + '">' + terms[l].terms[t].title + '</a></li>');
else
$('.ul' + l).append('<li><a href="' + urlPrefix + terms[l].terms[t].url + '">' + terms[l].terms[t].title + '</a></li>');
}
所以我在这些 block 上创建了按钮来管理其中列表的可见性。 但是我在将每个按钮与每个 block 耦合时遇到了问题。当我在某个 block 上按下它时 - 它会在所有 block 中显示“li”的内容。
$.fn.myFunc = function() {
$('li').show();
};
$('.ul' + l).append('<button type="button" onclick="$(this).myFunc(????);">Canada</button>');
当我尝试传递参数“l”(表示 block 数)时，它无法在范围内识别它(现在是问号)。 那么我怎样才能参数化我的按钮，以便它们只能作用于它们所在的 UL
最佳答案
$('li').show();
将显示页面上的所有 li 元素。
希望这个例子对你有帮助:
<body>
<ul class='ul1'>
<li>Argentina</li>
<li>Albania</li>
<li>Australia</li>
</ul>
<ul class='ul2'>
<li>Belgium</li>
<li>Bangladesh</li>
<li>Bahrain</li>
</ul>
</body>
<script type="text/javascript">
// the button click event handler
function showItems(){
// get the class attribute of the ul element
// (assuming it has 1 class only):
var ul = $(this).parent().attr('class');
// create a selector using the id of the ul $(.ul1 li), $(.ul2 li):
$('.'+ul+' li').show();
}
// add buttons to the lists:
$('.ul1').prepend('<button type="button" class="btn">A</button>');
$('.ul2').prepend('<button type="button" class="btn"">B</button>');
$('li').hide();
// bind the showItems click event handler to the buttons:
$(document).on('click', '.btn', showItems);
关于javascript - 为每个 UL block jQuery 中的按钮设置 onClick Action ，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46559922/