繁体   English   中英

<img> src属性不更改使用jQuery

[英]<img> src attribute not changing using Jquery

嗨,大家好,我制作了一个JqueryUI简单滑块,在一定值范围内制作了图像URL,然后尝试更改src属性。

我要更改四张图像。

此处检查jsFiddle

我认为代码很好,但无法正常工作,我不知道为什么?

替换为:

$("#" + postRetrmntImage).attr('src', ImageName );

对此:

$("#postRetrmntImage").attr('src', ImageName );

问题是您没有分配任何postRetrmntImage变量。

参见更新jsFiddle 演示

尝试这样做:

 $("#" + postRetrmntImage.toString()).attr('src', ImageName );

演示 http://jsfiddle.net/8Sw5J/

说明:请使用以下命令: $("#" + sliderId).prop('src', ImageName ); 因为在您的函数中,您将id作为sliderId.传递sliderId.

另外,如果我建议使用.prop好,请阅读: .prop()与.attr()

休息一下演示,您可以了解其工作原理,

希望这会有所帮助:)

完整的代码

 $(document).ready(function () {
            makeSingleSliderWithImage('postRetrmntMnthlyPaymt', 0, 10000, 0, 500);
        }
        );
        function makeSingleSliderWithImage(sliderId, minimum, maximum, val, steps) {

            //Display label shud have a X appended
            $('#' + sliderId).slider(
                {
                    //range: 'min',
                    min: minimum,
                    max: maximum,
                    step: steps,
                    //starting values for silders
                    value: val,
                    slide: function (event, ui) {
                        //var ImageURL = "Images/";
                        //var ImageName = "";
                        //var ext = ".jpg";

                        if ((ui.value >= 0) && (ui.value <= 2000))//Basic: 0-2000
                            ImageName = "http://www.iconempire.com/icon-processor/icon40.gif";
                        else if ((ui.value >= 2500) && (ui.value <= 4500))//Moderate: 2500-4500
                            ImageName = "http://aux.iconpedia.net/uploads/14234829766434728.png";
                        else if ((ui.value >= 5000) && (ui.value <= 7000))//Comfortable: 5000-7000
                            ImageName = "http://www.iconempire.com/icon-processor/icon40.gif";
                        else if ((ui.value >= 7500) && (ui.value <= 10000))//Luxury:7500-10,000
                            ImageName = "Luxury";
                        //var fullURL = ImageURL + ImageName + ext;
                        //change Image URL
                        $("#" + sliderId).prop('src', ImageName ); //{ src: fullURL });

                        alert($("#" + sliderId).prop('src'));
                        //change Slider Value
                        $("#" + sliderId + "X").text(ui.value);
                    }
                }
            );
        }​

换线...

$("#" + postRetrmntImage).attr('src', ImageName );

至...

$("#postRetrmntImage").attr('src', ImageName );

postRetrmntImage分配一个值,然后使用prop而不是attr 查看为什么使用prop

var postRetrmntImage="postRetrmntImage";
$("#" + postRetrmntImage).prop('src', ImageName );

尝试这个

$("#postRetrmntImage").attr('src', 'newimage.png');

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM