将div id插入脚本

时间:2017-10-13 04:18:59

标签: javascript jquery jquery-mobile

我有一个脚本,点击一个特定的div(例如id = packtoa)将(除其他外).addclass('show')到listview项目,其类别与点击的div的id相匹配。

哪个效果很好,但接下来我想要下一个div(id = packfhag)做同样的事情,然后是下一个。所以我在我的js中多次使用相同的脚本,只有id和amp;班级名称已更改。

我确信有一种非常明显的方法可以自动执行此操作,以便任何以“pack”开头的id将触发此脚本,拉出div id,并将其插入到类的名称为的脚本中调用。

我确信我已经接近尝试改编这个剧本了:

$("div[id^=pack]").each(function() {
    var match = this.id.match(/\w+$/)[0];
    $(this).addClass('show');
});

但我无法破解它。上面的任何一个都是错的,或者我将它插入脚本中的错误位置:

// Tears of Ameratsu menu functions
    $(document).bind('pageinit', function() {
// When link is clicked
  $('#packtoa').click(function() {
// collapse the expansions menu
     $("#expansionsmenu").click();
// hide everything except this expansion
    $(".hidden").removeClass('show');
    $(".packtoa").addClass('show');
// clear the search, and trigger a blank search
   $('input[data-type="search"]').val('');
    $('input[data-type="search"]').trigger("keyup");
    });
}); 

我错过了什么?

1 个答案:

答案 0 :(得分:0)

// for selecting div which starts with pack
// not recommended
$("div[id^='pack']");

最好的选择是使用class属性,将class属性添加到所有div,然后

$('.commonClass').addClass('show');

例如:

// this is for testing
// say you click  
$('#test').on('click',function(){
  $('.testclass').addClass('show');
});
.testclass{
display:none;
}
.show {
  display:block;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="testclass">div1</div>
<div class="testclass">div2</div>
<div class="testclass">div3</div>

<input type='button' value='Click me to view div' id='test' />