Question

我已经尝试了一段时间以使其正常工作。我对jquery或javascript没有太多经验。我想设置一个默认选项，该选项在按下按钮时从下拉选项中选择。我希望这也可以防止出现警报（不确定是否正确）。我已将以下代码添加到Squarespace的“代码注入”部分，这似乎工作正常。（编辑后，我已按照建议删除了代码）

我正在使用Brine模板。这是网站https://www.metastudio35.com/private-photography-services/event-collection的链接，密码为“ Google360”。

<squarespace:script src="plugin.js" combo="true"?>
<squarespace:script src="site.js" combo="true"?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

然后，我在重定向按钮所需的页面中添加了以下代码。也可以，但是没有“ $（”＃Additional Photos“）。val（” 0“）;”和“ $（“ .sqs-widgets-confirmation-content clear”）.dialog（“ close”）“行。

<script>

   $(document).ready(function(){


     $("#Additional Photos").val("0");

     $( ".sqs-widgets-confirmation-content clear" ).dialog( "close" )

    $(".sqs-add-to-cart-button").click(function(){
      window.location = '/booking/';

  });
   });


 </script>

这是我要删除/禁用的对话框的屏幕截图。 dialog box pop up screenshot

如果有人可以指出我正确的方向或告诉我我做错了什么，那将是徒劳的。

谢谢您的帮助。

Answer 1

我检查了您的网站，看来您的模板未使用jQuery，并且我不是在此简单功能中包含jQuery，而是在香草JS中编写了以下代码。

function setValue() {

    var dropdown = document.querySelectorAll('[data-variant-option-name="Additional Photos"]')[0];
    dropdown.value = '0';
    Y.one('#'+dropdown.id).simulate('change');

}

window.onload = setValue;

如果您有兴趣弄清楚为什么代码无法正常工作，请按以下说明进行操作：

$('#Additional Photos').val("0")

此行代码设置的元素的 ID 为“其他照片”，其值为“ 0”。

您的“其他照片”选择框没有没有“其他照片”的 ID ，而是具有随机生成的ID 每次刷新页面时都会重新生成。

所以您的代码不起作用的原因是因为您只是针对错误的元素：）

var dropdown = document.querySelectorAll('[data-variant-option-name="Additional Photos"]')[0];

由于选择框的ID不是恒定的，因此我们改为通过“数据变量选项名称”属性来定位选择框。我只是通过检查ChromDev工具上的选择框就知道了此常数属性。

dropdown.value = '0';
Y.one('#'+dropdown.id).simulate('change');

要考虑的另一件事是您的模板正在使用 YUI 处理选择框。这意味着我们需要手动触发“ change”事件以更新UI。从上面的代码中可以看到，第一行设置选择框的值，而第二行告诉YUI模拟'change'事件，从而更新UI。

希望这会有所帮助！

设置默认选项并禁用警报

1 个答案: