1

我下载了一个主题，似乎遇到了一些麻烦。有问题的页面在这里 - http://pureearthsoaps.com/test.html

每个产品都是使用（如果我解释正确的话）Javascript 变量创建的。见下文：

  1: {
name: 'Bar Soap',
scent: 'Cucumber & Oatmeal, Patchouli, Peppermint, Frankincense, Holiday, Coffee & Hazelnut, Apple, and more',
size: '1 bar',
price: '3.<span class="small">95</span>',
short_desc: 'An innovative and moisturizing way to keep shower time fun.',
desc: 'Since we all love being happy naked, why not keep it that way? Treat yourself to scrumptious skincare with Naked Bar, an innovative and moisturizing way to keep shower time fun.'},

我在这里输入信息，它对应于这里的代码：

      __ += '<li id="wine-list-'+i+'">'+wines[i].name+',</li>';
  full += '<div id="wine-info-'+i+'" class="wine-info transition-05"><h2>'+wines[i].name+'</h2><h4></h4>'+
    '<div class="line"></div>'+
    '<div class="price">$'+wines[i].price+'</div>'+
    '<div class="lbl"><label>Scent:</label><span>'+wines[i].scent+'</span></div>'+
    '<div class="lbl"><label>Size:</label><span>'+wines[i].size+'</span></div>'+
    '<div class="img"></div>'+
    '<div class="bottle-x"></div>'+
    '<div class="desc">'+wines[i].desc+'</div>'+
    '<div class="order">'+wines[i].order+'</div>'+
  '</div>';

目前，显示在该产品页面上的“立即订购”按钮出现在每个产品上，但无法链接。上面“order”的div类是在一个程序员朋友的建议下添加的；它使按钮出现，但我们无法使其工作。我在第一个代码块的“desc”行下面添加了这个，但没有成功：

    order: '<a  onClick="location.href='http://google.com'" href="http://google.com"></a>'

所以……救命！我该如何进行这项工作？

4

3 回答 3

2

其他人已经解决了报价的直接问题。我将解决您代码中的一些潜在问题，这将有助于防止将来出现错误。

首先

var obj = {}

这是一个 JavaScript 对象，特别是一个对象字面量。

第二

JavaScript 变量不能以数字开头或只能是数字，因此1 = {};无效

通常，您需要的是对象数组，而不是将您的对象分配给一个数字并遍历它们。所以...

var wines = [{name:'wine', blah:'', ......}, {name:'second wine', ....}]

这样，您可以在获取的同时循环遍历它们wines[i]，并且您的代码将是有效的:)

第三

尝试减少 js 写入页面的 html 数量通常是一个好习惯。

为什么？调试起来更容易，因为 innerHTML/.html() 可以包含许多语句。而且它也更快。

尝试将元素放在页面上并使用 and 写入它们getElementById，textContent或者使用 jquery 的选择器 and text()or html()。如果需要隐藏它们，请在 html/css 中将它们设置为隐藏，稍后使用 js 修改该 css 属性或类。

最后

内联 onClicks 是如此 90 年代。当你开始双弦交叉时，实际上会让你头疼。

使用 jQuery 的on()方法或

document.getElementById('elem').onclick = function(){
   //Code here
};
于 2013-03-29T21:22:35.870 回答
0

引号引起了您的问题。

{
  name: 'Bar Soap',
  scent: 'Cucumber &amp; Oatmeal, Patchouli, Peppermint, Frankincense, Holiday, Coffee &amp; Hazelnut, Apple, and more',
  size: '1 bar',
  price: '3.<span class="small">95</span>',
  short_desc: 'An innovative and moisturizing way to keep shower time fun.',
  desc: 'Since we all love being happy naked, why not keep it that way? Treat yourself to scrumptious skincare with Naked Bar, an innovative and moisturizing way to keep shower time fun.',
  order_url: 'http://google.com'
}

然后，做这样的事情：

for (var i in wines) {
      _ += '<li id="wines-'+i+'"><h2>'+wines[i].name+'</h2>'+
        '<div class="lbl"><label>Scent:</label><span>'+wines[i].scent+'</span></div>'+
        '<div class="lbl"><label>Size:</label><span>'+wines[i].size+'</span></div>'+
        '<div class="img"></div>'+
        '<div class="line"></div>'+
        '<div class="short-desc">'+wines[i].short_desc+'</div>'+
        '<div class="price">$'+wines[i].price+'</div>'+
      '</li>';
      __ += '<li id="wine-list-'+i+'">'+wines[i].name+',</li>';
      full += '<div id="wine-info-'+i+'" class="wine-info transition-05"><h2>'+wines[i].name+'</h2><h4></h4>'+
        '<div class="line"></div>'+
        '<div class="price">$'+wines[i].price+'</div>'+
        '<div class="lbl"><label>Scent:</label><span>'+wines[i].scent+'</span></div>'+
        '<div class="lbl"><label>Size:</label><span>'+wines[i].size+'</span></div>'+
        '<div class="img"></div>'+
        '<div class="bottle-x"></div>'+
        '<div class="desc">'+wines[i].desc+'</div>'+
        '<a href="'+wines[i].order_url+'"><div class="order"></div></a>'+
      '</div>';
    }

另外，不要忘记为所有商品定义“订单”属性。

希望有帮助。

于 2013-03-29T20:45:46.170 回答
0

你的引号有问题。如果你有一个href，为什么你需要一个onClick？尝试这个：

order: '<a href="http://google.com">order now</a>'

或这个

order : '<a href="#" onClick="location.href=\"http://google.com\"">order now</a>'

我刚刚看了你的网站，似乎该order属性不存在。这是一个例子，它应该看起来像这样。还要注意花括号的位置，oder线必须在里面。

1: {
  name: 'Bar Soap',
  scent: 'Cucumber &amp; Oatmeal, Patchouli, Peppermint, Frankincense, Holiday, Coffee     &amp; Hazelnut, Apple, and more',
  size: '1 bar',
  price: '3.<span class="small">95</span>',
  short_desc: 'An innovative and moisturizing way to keep shower time fun.',
  desc: 'Since we all love being happy naked, why not keep it that way? Treat yourself  to scrumptious skincare with Naked Bar, an innovative and moisturizing way to keep shower time fun.',
  order: '<a href="/order.php">order now</a>'
},
于 2013-03-29T20:41:03.030 回答