Question

我知道如何使用优秀的旧JavaScript做到这一点，但我希望减少我的代码并更好地理解jQuery，所以这里'我的问题：

我有一组包含SRC属性的图像和输入，这些都包含在名为#popupForm的父DIV中。我希望使用.each方法遍历我的表单项（有些是在子DIV中进行样式化）并根据字符串中的匹配替换部分SRC - 我不会介绍为什么我要这样做但是我有一个拥有众多主题的网站。这是我到目前为止所拥有的

var thisTheme = $("hiddenTheme").val(); // this is a theme variable
var $inputs = $('#popupForm :input');  // need to later add images here too

$inputs.children().each(function () {
$this.attr("src") = $this.attr("src").replace('whatIwantToReplace', thisTheme);
});

这应该相当简单。任何帮助表示赞赏。

更新

使用以下

// theming script
var thisTheme = $("#hiddenTheme").val();
var defaultTheme = "/midway/"

$('#popupForm img').each(function () {

    var thisSRC = $(this).attr('src');
    if (thisSRC.indexOf(defaultTheme) !== -1) {

        var new_src = $(this).attr('src').replace(defaultTheme, thisTheme);
        $(this).attr('src', new_src);

    }

});

Answer 1

var thisTheme = $("hiddenTheme").val(); // this is a theme variable
var $inputs = $('#popupForm :input');  // need to later add images here too

$inputs.children().each(function () {
var new_src = $this.attr("src").replace('whatIwantToReplace', thisTheme);
$(this).attr('src', new_src);
});

Answer 2

首先，$this在这里没有任何意义 - 很多作者会使用$this存储$(this)值以避免调用$ jQuery函数太多次，但你实际上必须设置$this = $(this)才能使用它。不设置它应该导致抛出错误。

此外，$inputs.children()似乎很奇怪，因为input元素不能有子元素，也不能具有src属性。

我相信你的意思是#hiddenTheme用于选择输入元素值的选择器，除非你实际上有一个标签名为hiddenTheme的元素。

最后，可以用这种方式更好地重写代码，完全避免each循环：

var thisTheme = $("#hiddenTheme").val();

$('#popupForm img').attr('src', function(index, value){
    return value.replace('whatIWantToReplace', thisTheme);
});

使用JQuery的.each循环遍历表单项并使用.replace更改src

2 个答案: