JavaScript -多参数函数，它是用于多图像库的字符串。
我有这样的功能，可以让画廊通过他的ID：
document.getElementById('galleryID').onclick = function (event) {
event = event || window.event;
var target = event.target || event.srcElement,
link = target.src ? target.parentNode : target,
options = {index: link, event: event},
links = this.getElementsByTagName('a');
bg.Gallery(links, options);
};但问题是，当我在一份文件中有多个画廊时：
id="gallery01"，id="gallery02"，id="gallery03" .一直到id="gallery11"。
现在，我用不同的ID多次播放了11次图片库脚本代码：
document.getElementById('gallery01').onclick = function (event) { ... document.getElementById('gallery02').onclick = function (event) { ... document.getElementById('gallery03').onclick = function (event) { ...
一直到..。
document.getElementById('gallery11').onclick = function (event) { ...
我希望有一个JS函数，而不是11。我如何做到这一点?
我想使用正则表达式，但是我的组合不起作用。我认为这将是非常好的解决方案，如果它可以这样做-使用正则exp在适当的地方是'galleryID'。
回答 3
Stack Overflow用户
发布于 2016-04-27 10:45:42
尝试使用下面的函数调用添加事件
<div class="gallery" id="gallery1" onclick="getGalleryDetailFor(event)">
<div class="gallery" id="gallery2" onclick="getGalleryDetailFor(event)">编辑过的
<script>
function getGalleryDetailFor(event)
{
event = event || window.event;
var target = event.target || event.srcElement,
link = target.src ? target.parentNode : target,
options = {index: link, event: event},
links = this.getElementsByTagName('a');
bg.Gallery(links, options);
}
</script>新更新
<div class="gallery" id="gallery1" onclick="getGalleryDetailFor('gallery1')">Gallery 1</div>
<div class="gallery" id="gallery2" onclick="getGalleryDetailFor('gallery2')">Gallery 2</div>JavaScript
function getGalleryDetailFor(ids)
{
document.getElementById(ids).addEventListener('click',function (event)
{
event = event || window.event;
var target = event.target || event.srcElement,
link = target.src ? target.parentNode : target,
options = {index: link, event: event},
links = this.getElementsByTagName('a');
bg.Gallery(links, options);
});
}Stack Overflow用户
发布于 2016-04-27 10:54:54
我有两个想法:首先，您可以添加类并使用类似的
getElementsByClassName('gallery').forEach(function(galery){
gallery.function (event) { ...
})或使用您想要使用的所有id创建数组，并使用forEach，如
['id1','id2','id3'....].forEach(idName=>{
document.getElementById(idName).onclick = function (event) { ...
})编辑：
也许你应该检查一下：Find all elements based on ids using regex on jQuery selector
Stack Overflow用户
发布于 2016-04-27 11:08:02
您可以定义一般类型，例如“ui库”，并将类添加到要将此事件绑定到的每个元素中：
<div id="gallery1" class="ui-gallery"></div>
<script>
// with multiple handlers for different gallery elements
var handlersPool = {
"default" => function(event) { ... },
"gallery1" => function(event) { ... },
"gallery2" => function(event) { ... },
...
}
var uiGalleries = document.getElementsByClassName("ui-gallery");
for (i = 0; i < uiGalleries.length; i++) {
var el = uiGalleries[i];
el.onclick = handlersPool[el.id] || handlersPool.default;
}
</script>https://stackoverflow.com/questions/36887492
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号