Question

我几乎不好意思说我无法找到更好的方法来做到这一点。有人可以帮我重构这段代码吗？我尝试在一个匹配函数中做一些“或”运算符，但它似乎没有使用em。

$('.ui-icon-pencil, .ui-icon-check, .ui-icon-close, .ui-icon-trash').hover(function(e) {          

    console.log($(this).attr('class'));

    optionsClass = 'ui-icon-pencil';
    confirmClass = 'ui-icon-check';
    closeClass = 'ui-icon-close';
    deleteClass = 'ui-icon-trash';

    icon = $(this).attr('class').match(optionsClass);

    if(icon == null) {
    icon = $(this).attr('class').match(confirmClass);
    }
    if(icon == null) {
    icon = $(this).attr('class').match(closeClass);
    }
    if(icon == null) {
    icon = $(this).attr('class').match(deleteClass);
    }

    console.log('icon = '+icon);

});

Answer 1

使用RegExp时，请以正确的方式执行：

$('.ui-icon-pencil, .ui-icon-check, .ui-icon-close, .ui-icon-trash').hover(function(e) {
    var icon = /\bui-icon-(?:pencil|check|close|trash)\b/.exec(this.className);
    if (icon) { // If a match is found
        icon = icon[0];
    }
    console.log('icon = ' + icon);
});

this.className包含（以空格分隔的）类名列表
/ui-icon- ... /是一个RegExp字面值。
regex.exec(input_string)是等效的，但比input_string.match(regex)更整洁。

找到匹配项后，icon将成为以下格式的数组：

[full match, group1, group2, ..., groupN]

要查看没有单独组的完整匹配项，请使用icon[0]（icon数组的第一个元素）。

string.match将第一个参数转换为RegExp。通常，regex.exec优先于string.match，因为如果输入不是字符串（意外？），后一种方法会失败。

我的RegEx说明：\b匹配单词边界。 (?:pencil|check|close|trash)是一个已取消引用的RegEx群组，与"pencil"，"check"，"close"或"trash"匹配。

Answer 2

$('.ui-icon-pencil, .ui-icon-check, .ui-icon-close, .ui-icon-trash').hover(function(e) {          

    var icon = $(this).attr('class').match(/ui-icon-(?:pencil|check|close|trash)/)[0]
    console.log('icon = '+icon);

});

需要帮助重构这个jquery片段

2 个答案: