我正在使用Sidr，这是一个提供侧边菜单的jQuery插件。
我正在尝试执行以下操作：
通过$ .post（）和json返回从数据库获取数据。作品
将此数据发布到我的Sidr菜单中。不起作用！！！
执行脚本时会发生什么：Sidr菜单打开，但是在其中找不到var SHOPcontent内容。
我什至尝试在打开Sidr菜单的同时运行alert(SHOPcontent)。警报成功：它显示var SHOPcontent的内容。那么，为什么Sidr菜单无法显示它？
在下面查看我的代码，var SHOPcontent包含通过Sidr source选项回调回调到我的Sidr菜单中的一堆html。
product_tags.click(function() {
$.sidr('toggle', 'shop_bar');
$.post("display_products_2.php", {'product_title_selected': product_title_selected}, function(display_shop) {
var shop_array = $.parseJSON(display_shop);
for ( c = 0; c <shop_array.length; c++)
{
var one_color = "<div style='background-color:" + shop_array[c][3] + "'" + "class='one_color'></div>"
var product_colors = product_colors + one_color;
};
var one_color = "";
var SHOPcontent =
"<div id='shop_bar'>" +
"<div style='background-color:" + shop_array[0][3] + "'" + "id='shop_translucent_banner'></div>" +
"<div id='shop_title'>" +
"<span id='shop_brand'>" +
shop_array[0][2] +
"</span>" +
shop_array[0][4] +
"</div>" +
"<div id='shop_price'>" +
shop_array[0][6] +
"</div>" +
"<div id='shop_picture'>" +
"<img src='" + "product_pictures/" + shop_array[0][9] + "'>" +
"</div>" +
"<div id='shop_description'>" +
shop_array[0][5] +
"</div>" +
"<div id='more_product_information'>MORE INFORMATION</div>" +
"<div id='shop_colors'>" +
product_colors +
"</div>" +
"<div id='buy'>Buy</div>" +
"</div>" ;
});
$('#shop_bar').sidr( {
displace: false,
name: 'shop_bar',
source: function() {
$('.sidr').html(SHOPcontent)
}
});
寻找帮助指出我的代码出了什么问题。
最佳答案
因为sidr函数是从post success函数的外部调用的，所以sidr没有启动。请尝试以下方法。确保这在$(document).ready()功能中。
product_tags.click(function() {
$.sidr('toggle', 'shop_bar');
$.post("display_products_2.php", {
'product_title_selected': product_title_selected
}, function(display_shop) {
var shop_array = $.parseJSON(display_shop);
for (c = 0; c < shop_array.length; c++){
var one_color = "<div style='background-color:" + shop_array[c][3] + "'" + "class='one_color'></div>"
var product_colors = product_colors + one_color;
};
var one_color = "";
var SHOPcontent =
"<div id='shop_bar'>" +
"<div style='background-color:" + shop_array[0][3] + "'" + "id='shop_translucent_banner'></div>" +
"<div id='shop_title'>" +
"<span id='shop_brand'>" +
shop_array[0][2] +
"</span>" +
shop_array[0][4] +
"</div>" +
"<div id='shop_price'>" +
shop_array[0][6] +
"</div>" +
"<div id='shop_picture'>" +
"<img src='" + "product_pictures/" + shop_array[0][9] + "'>" +
"</div>" +
"<div id='shop_description'>" +
shop_array[0][5] +
"</div>" +
"<div id='more_product_information'>MORE INFORMATION</div>" +
"<div id='shop_colors'>" +
product_colors +
"</div>" +
"<div id='buy'>Buy</div>" +
"</div>";
$('#shop_bar').sidr({
displace: false,
name: 'shop_bar',
source: function() {
$('.sidr').html(SHOPcontent)
}
});
});
});