HTML 对象标记“数据”属性不会随 jQuery 更改而更新答案

【问题标题】：HTML Object tag 'data' attribute wont update with jQuery changeHTML 对象标记“数据”属性不会随 jQuery 更改而更新
【发布时间】：2014-04-10 12:23:45
【问题描述】：

从这个 JSFiddle 可以看出：http://jsfiddle.net/cYxy7/1/

我正在使用 jQuery 更改对象标记的“数据”属性。但是，即使我能够更改源代码中的数据属性，对象的实际数据流也不会改变，并且播放的是相同的视频。有人知道解决办法吗？

我尝试了一些“刷新”技术，但到目前为止都没有奏效。

HTML：

<object data="currentURL"></object>

jQuery:

$(document).ready(function(){
    $('body').on('click', "button#switch", function() {
    $( "object" ).attr("data", newURL);
});        
})

【问题讨论】：

Changing data content on an Object Tag in HTML的可能重复

标签： javascript jquery html css

【解决方案1】：

以下代码对我有用

$( "object" ).replaceWith('<object data="' + newURL + '"></object>');

【讨论】：

【解决方案2】：

将此附加到您的代码中。这可能会有所帮助。

 $("object param[name=flashvars]").attr("value", $("object").attr("data"));

【讨论】：

【解决方案3】：

你需要更新一个参数，然后是数据属性：

$( "object param[name=flashvars]" ).attr("value", "hostname=www.twitch.tv&channel=liquidwifi&auto_play=true&start_volume=25");
$( "object").css('display', 'none');
$( "object").attr('data',  "http://www.twitch.tv/widgets/live_embed_player.swf?channel=liquidwifi").css('display', '');

见http://jsfiddle.net/W7NTd/2/

【讨论】：

【解决方案4】：

编辑：

我发现了一些更奇怪的东西。在您更改对象的盒子模型之前，更改参数不起作用：

$(document).ready(function(){
    $('body').on('click', "button#switch", function() {

    $( 'object param[name="flashvars"]' ).attr("value", "hostname=www.twitch.tv&channel=liquidwifi&auto_play=true&start_volume=25");

     $( "object").attr('data',  "http://www.twitch.tv/widgets/live_embed_player.swf?channel=liquidwifi").hide().show(); 

});        
})

这非常有效：http://jsfiddle.net/W7NTd/1/

由于某些奇怪的原因，更改参数值不起作用，只创建新的 html 似乎对我有用：

$(document).ready(function(){
    $('body').on('click', "button#switch", function() {
        $('object param[name="flashvars"]').attr('value', $('object param[name="flashvars"]').attr('value').replace('ivan', 'liquidwifi'));
        var new_html = $('#wrapper').html();
        $('#wrapper').html(new_html);
    });        
})

我为此添加了一个包装器。

See the fiddle

【讨论】：

【解决方案5】：

flash 对象的重新加载相当棘手。

尝试使用这个简单的flashloader 或SWFObject。

【讨论】：

你应该提供一些代码示例，而不仅仅是指向库

【解决方案6】：

原因是你没有改变参数值

在改变对象 attr 的同时改变参数 flashvars 的值

在这里演示： http://jsfiddle.net/cYxy7/3/

$(document).ready(function () {
    $('body').on('click', "button#switch", function () {
        alert("The object's 'data' attritube is currently: " + $("object").attr("data"));
        $("object").attr("data", "http://www.twitch.tv/widgets/live_embed_player.swf?channel=liquidwifi");
        $("param[name='flashvars']").attr("value", "hostname=www.twitch.tv&channel=liquidwifi&auto_play=true&start_volume=25");
        alert("The object's 'data' attribute is now: " + $("object").attr("data"));
    });
})

干杯！

【讨论】：