尝试将查询字符串中的值分配给Shopify行项目属性

时间:2013-06-18 00:46:42

标签: javascript html query-string shopify liquid

HTML

 <div>
    <input type="hidden" id="shirtImg" name="properties[ShirtImg]"/>
 </div>

 <div id="purchase" onclick="createLineItemProperties()">
            <p class="price"></p>                                 
            <input class="btn" type="submit" name="add" id="add-to-cart" value="Add to Cart" />
 </div>

此代码位于product.liquid中。所有这些都包含在/ cart / add表单标签中。

的Javascript

 function getUrlVars() {
    var vars = {};
    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function (m, key, value) {
    vars[key] = value;
  });
  return vars;

}

function createLineItemProperties() {
   if(getUrlVars()["side1"] != null){
      console.log("inside if statement");
      document.getElementById("shirtImg").value = getUrlVars()["side1"];
   }
console.log(document.getElementById("shirtImg").value);
}

这里javascript从查询字符串中提取一个名为“side1”的值。 console.log实际上最终打印出我想要的结果,但出于某种原因,它似乎没有保存在订单项属性中。

1 个答案:

答案 0 :(得分:0)

事实证明,单击“添加到购物车”时运行该功能是一个坏主意,因为它最终首先发送表单数据然后重新分配id后,给我留下了不希望的结果。我只是通过body标签的onload事件来调用该函数,现在它可以正常工作。