Question

有没有更好的方法在jQuery中执行此操作？根据href的结尾部分，我正在运行一些代码。当前的版本肯定很难看......

$(document).ready(function(){

    $('a[href$="pdf"], a[href$="zip"], a[href$="doc"], a[href$="docx"], a[href$="xls"], a[href$="xlsx"], a[href$="ppt"], a[href$="pptx"], a[href$="mp3"], a[href$="txt"], a[href$="vsd"], a[href$="rar"], a[href$="wma"], a[href$="avi"], a[href$="mmv"]').bind("click", function() {
        // do processing here
    });

});

我无法添加ID或类属性，因为html是由CMS生成的

Answer 1

您的选择器错误，而不是选择这么多元素尝试这个

//this will attach click event only to 
$(document).ready(function(){

    $('a').live('click', function() {//Use any class name associated to this anchor or an id to select it

       //this.href will give the href of the anchor which is clicked.
       //check for href contians the required extension or no by writing a switch block or if/else conditions

      var extn = (/[.]/.exec(this.href)) ? /[^.]+$/.exec(this.href) : undefined;
      if(extn)
         extn = extn[0];

       // do processing here
       switch(extn.toLowerCase())
       {
          case "pdf" :
               break;
          case "zip" :
               break;

          ...
          ...

       }

    });

});

Answer 2

是否考虑过从逻辑中外部化选择器？

var x = new Array(); 
x = ['pdf', 'zip', 'doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'mp3', 'txt', 'vsd', 'rar', 'wma', 'avi', 'mmv']; 

for (y in x)
{
    $('a[href$="'+y+'"]').click(function()
    {
        // do processing here
    });
}

Answer 3

您可以尝试自定义选择器。因此，如果使用正确的代码，您可以执行以下操作：

$('a:HrefMatch').click(function(){
});

实现选择器代码可能类似于

$.extend($.expr[':'], {  
    HrefMatch: function(elem) {  
        var elemHref= $(elem).attr("href");
        var searchRegex = /((pdf)|(zip)|(doc)|(docx)|(xls)|(xlsx)|(ppt)|(pptx)|(mp3)|(txt)|(vsd)|(avi)|(mmv))$/
        return elemHref.test(searchRegex);  
    }  
});

（我还没有完全包含正则表达式中的所有文档类型，但您可以自己将它们包括在内）

另外，我已将选择器分成3行代码。它可以很容易：

$.extend($.expr[':'], {  
    HrefMatch: function(elem) {  
        return $(elem).attr("href").test(/((pdf)|(zip)|(doc)|(docx)|(xls)|(xlsx)|(ppt)|(pptx)|(mp3)|(txt)|(vsd)|(avi)|(mmv))$/);  
    }  
});

Answer 4

$(document).ready(function(){
    var extensions = ["doc", "xls", "ppt"]; // can extend this
    $('a').filter(function() {
        var href = $(this).attr('href');
        for(var i = 0; i < extensions.length; i++) {
            if(href.substring(href.length - extensions[i].length) == extensions[i]) {
                return true;
            }
        }
    }).bind('click', function(){

    });

});

Answer 5

尝试“data-”属性。

您的代码如下所示：

<div class="files">
    <a href="file.pdf" data-extension="pdf">filename.pdf</a>
    <a href="file.zip" data-extension="zip">filename.zip</a>
</div>

使用Javascript：

$('div.files a').bind("click", function() {
       // do processing here
       var extension = $(this).data("extension");
});

Answer 6

怎么样：

$('a:not[href$="htm"]')

显然，将htm替换为您网站上的标准扩展名。

基于href值选择元素的更好方法

6 个答案: