Question

我目前正在尝试使用VLC插件和html对象标签以下列方式播放.wav文件列表：

$.each(rdata['results'],function(key,data)
{
    newRow += '<div class="row-fluid"><div class="span3"><label>Name : ' + data['recordingId'] + '.wav</label></div>';
    newRow += '<div class="span2"><label>duration : ' + data['duration']+ '</label></div><div class="span4" style="background: transparent url(img/ajax-loader.gif) no-repeat">';
    newRow += '<object data=' + audioUrl +' type="application/x-google-vlc-plugin" width="300" height="30" onerror="error()"></object></div><div style="width:20%"><button type="button" class="btn showShareModal" data-toggle="modal">Share Feedback</button><button type="button" class="btn showRaiseModal" data-toggle="modal">Raise Issue</button></div></div><hr/>';
}

编辑：整个功能定义：

function fnFormatDetails ( apiUrl, baseUrl  )
{
    var newRow = "";
    var audioUrl;

    $.ajax({
    type: "GET",
    url: apiUrl,
    async: false,
    contentType : "text/json",

    beforeSend:function()
    {
        image.src = "img/ajax-loader.gif";
    },

    success: function(data) 
    {
        console.log("success from " + apiUrl);
        var rdata = $.parseJSON(data);

        $.each(rdata['results'],function(key,data){
            audioUrl = baseUrl + data['recordingId'];
            newRow += '<div class="row-fluid"><div class="span3"><label>Name : ' + data['recordingId'] + '.wav</label></div>';
            newRow += '<div class="span2"><label>duration : ' + data['duration']+ '</label></div><div class="span4" style="background: transparent url(img/ajax-loader.gif) no-repeat">';
            newRow += '<object data=' + audioUrl +' type="application/x-google-vlc-plugin" width="300" height="30" onerror="error()"></object></div><div style="width:20%"><button type="button" class="btn showShareModal" data-toggle="modal">Share Feedback</button><button type="button" class="btn showRaiseModal" data-toggle="modal">Raise Issue</button></div></div><hr/>';
        });
    },

    error: function(xmlhttprequest,textstatus,message){

        if(textstatus === "timeout")
            alert("Read timeout. Try again after some time");
        else if(xmlhttprequest.status == 500)
            alert("Sorry! connection reset by third party server");
    },

    complete:function(){
        image.src = saveSrc;
    }   
}); 
newRow = newRow.substring(0,newRow.length - 5);
return newRow;
    //------------------------------------------------------------  
};

我还有如下定义的错误函数：

function error()
{
    alert("Resource load error");
}

但是，即使audioUrl引发内部服务器错误，也不会触发onerror。有人可以告诉我为什么会这样吗？

感谢。

Answer 1

在你的成功回调中：

success: function(data) 
{
    console.log("success from " + apiUrl);
    var rdata = $.parseJSON(data);

    $.each(rdata['results'],function(key,data){
        audioUrl = baseUrl + data['recordingId'];
        newRow += '<div class="row-fluid"><div class="span3"><label>Name : ' + data['recordingId'] + '.wav</label></div>';
        newRow += '<div class="span2"><label>duration : ' + data['duration']+ '</label></div><div class="span4" style="background: transparent url(img/ajax-loader.gif) no-repeat">';
        newRow += '<object data=' + audioUrl +' type="application/x-google-vlc-plugin" width="300" height="30" onerror="error()"></object></div><div style="width:20%"><button type="button" class="btn showShareModal" data-toggle="modal">Share Feedback</button><button type="button" class="btn showRaiseModal" data-toggle="modal">Raise Issue</button></div></div><hr/>';
    });
},

看起来您正在newRow中构建HTML字符串，但实际上并没有将它插入到DOM中。您需要执行$(document.body).append($(newRow))之类的操作（如果您想将其添加到HTML正文的末尾，则只需一个示例）。

<object>标记</object>中的onerror属性

1 个答案: