jQuery代码中的jQuery事件

时间:2013-11-24 17:41:35

标签: javascript jquery

我正在尝试这样做当你点击加载了jQuery的图像时它会触发一些东西,我决定使用html的“onclick”事件运行一个jQuery脚本,但似乎有一个错误。 / p>

错误:

Unexpected token "/"

代码:

$("<img>").attr("src", item.preview.medium).attr("style", "margin-right:1%;margin-top:1%;").attr("onclick", 
    "$('#placeholder').html('<object type="application/x-shockwave-flash" 
    style="float:left;margin-left:1%;margin-bottom:1%;" height="378" width="620" 
    id="live_embed_player_flash" 
    data="http://www.twitch.tv/widgets/live_embed_player.swf?channel=' + item.channel.display_name + '&auto_play=false"
    bgcolor="#000000">
         <param name="allowFullScreen" value="true" />
         <param name="allowScriptAccess" value="always" />
         <param name="allowNetworking" value="all" />
         <param name="movie" value="http://www.twitch.tv/widgets/live_embed_player.swf" />
         <param name="flashvars" value="hostname=www.twitch.tv&channel=' + item.channel.display_name + '&auto_play=false&start_volume=25" />
     </object>')").appendTo("#content");

新守则:

<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
$.getJSON("https://api.twitch.tv/kraken/search/streams?q=path%20of%20exile&callback=?", function (data) {
    $.each(data.streams, function (index, item) {
                $("<img>").attr("src", item.preview.medium).attr("style", "margin-right:1%;margin-top:1%;").attr("id", "imgg").appendTo("#content");
                       $("#imgg").click(function() {
                       var obj=$( "<object></object>", 
                       { "style" : "float:left;margin-left:1%;margin-bottom:1%;",
                       "height": "378", "width": "320", "bgcolor": "#000000",
                       "id" : "live_embed_player_flash",
                       "data" : "http://www.twitch.tv/widgets/live_embed_player.swf?channel=" + item.channel.display_name + "&auto_play=false" 
                       });
                       $('#placeholder').empty().append(obj);
                })
    });

});
</script>

错误:

http://gyazo.com/5cd42fd599822344b0a00c5f8f5e63ab.png

当我点击图像btw时,它只会出现此错误。

2 个答案:

答案 0 :(得分:1)

您的代码字符串存在问题报价管理:

"$('#placeholder').html('<object type=" // being the string
application/x-shockwave-flash // not in the string, the "/" here being the unexpected token.

在一行中不尝试这样做可能会容易得多,并使用单独的函数为占位符生成对象html块 - 也许用jQuery构建它然后获取html字符串?

答案 1 :(得分:1)

// this creates the object...

var obj=$( "<object></object>", 
   { "style" : "float:left;margin-left:1%;margin-bottom:1%;",
   "height": "378", "width": "320", "bgcolor": "#000000",
   "id" : "live_embed_player_flash",
   "data" : "http://www.twitch.tv/widgets/live_embed_player.swf?channel=" + item.channel.display_name + "&auto_play=false" 
   });

// now you need to add the params to this
....
// finally put it in place
$('#placeholder').empty().append(obj);