Question

我尝试使用jQuery将多列表表单中的选定值传递到HubSpot表单上。我构建的表单如下所示：

区域，未传递，但是多列表表单的第一部分。

<div class="form-group">
 <label for="region">Global Region</label>
  <select class="form-control" name="region" id="region">
    <option value="">Please choose a region</option>
    <option value="North America">North America</option>
    <option value="Africa">Africa</option>
    <option value="Asia">Asia</option>
    <option value="Carribean">Carribean</option>
    <option value="Central America">Central America</option>
    <option value="Europe">Europe</option>
    <option value="Middle East">Middle East</option>
    <option value="Oceania">Oceania</option>
    <option value="South America">South America</option>
</select>
</div>

国家，需要通过。在这里只包括北美部分：

<div class="form-group country-north-america hidden">
 <label for="country-north-america">Country</label>
    <select class="form-control" name="country" id="country-north-america">
        <option value="">Please select a country</option>
        <option value="CA">Canada</option>
        <option value="PM">St. Pierre and Miquelon</option>
        <option value="US">United States</option>
        <option value="Virgin Islands (non-U.S.)">Virgin Islands (non-U.S.)</option>
    </select>
    </div>

然后美国的状态是另一个层次。

所以我一直试图将该值从该国家传递到HubSpot表单以减少输入重复。我已更新所有值以实际匹配HubSpot的值。因此，美国的期权价值是美国，以匹配HubSpot的期权价值。

我有以下似乎不起作用，我无法弄清楚需要发生什么：

var country = $('select[name="country"] option:selected').val()
$(window).load(function(){
 $('select[name="country"]').val(country).change();
});

我也尝试过使用HubSpot中的onFormReady来获得类似的结果。

hbspt.forms.create({
    portalId: "123",
    formId: "321-123",
    onFormReady($form){
       $('select[name="country"]', $form).val($(country).change());
       $('select[name="state"]', $form).val(state).change(); 
       $('input[name="email"]', $form).val('test@foobar.com').change();
    });

如何使用jQuery将国家/地区从一种形式传递到另一种形式？

编辑：我也尝试过：

var country = $('select#country-africa option:checked').val() - Nothing
var country = $('select#country-africa').val('') - I get jQuery.fn.init [select#country-africa.form-control, prevObject: jQuery.fn.init(1), context: document, selector: "select#country-africa"]

其他编辑：

如果我使用以下变量，我会获得与所记录区域相关但未应用更改的国家/地区的完整列表。

var country = $('select#country-africa').text()

尝试以下方法：

 var country = $('select#country-africa option:checked').val() 
 $(document).ready(function(){ $('select[name="country"]').val(country).trigger('change'); })

没有工作。在我的onFormReady中试过以下内容：

$('select[name="country"]').val('select#country-africa').prop("selected", true).trigger('change');

没有工作。

Answer 1

必须做类似的事情：

$ ./bin/readlargecsvbuf dat/large.csv
records: 10   cols: 26

a1   1   1 3.5   5   1   1   1   0   0   6   0 155  21 142  22  49   1   9   1   0   0   0   0   0   0   0
a1  10   2   5   5   1   1   2   0   0  12   0  50  18 106  33 100  29  45   9   8   0   1   1   0   0   0
a1  19   3   5   5   1   1   3   0   0  18   0  12  12  52  40  82  49  63  41  23  16   8   2   0   0   0
a1  28   4 5.5   5   1   1   4   0   0  24   0   2   3  17  16  53  53  63  62  43  44  18  22   4   0   4
a1  37   5   3   5   1   1   5   0   0   6   0 157  22 129  18  57  11   6   0   0   0   0   0   0   0   0
a1  46   6 4.5   5   1   1   6   0   0  12   0  41  19 121  31  90  34  37  15   6   4   0   2   0   0   0
a1  55   7 5.5   5   1   1   7   0   0  18   0  10   9  52  36  86  43  67  38  31  15   5   7   1   0   1
a1  64   8 5.5   5   1   1   8   0   0  24   0   0   3  18  23  44  55  72  57  55  43   8  19   1   2   3
a1  73   9 3.5   5   1   1   9   1   0   6   0 149  17 145  21  51   8   8   1   0   0   0   0   0   0   0
a1  82  10 4.5   5   1   1  10   1   0  12   0  47  17 115  35  96  36  32  10   8   3   1   0   0   0   0

Answer 2

在呈现DOM之前，window.load事件会在浏览器窗口/选项卡初始化时触发。所以你没有得到你想要的结果，因为你试图在表格存在之前对其进行操作。尝试使用document.ready或仅使用传递给jQuery对象的IIFE。

此外，我很确定已经弃用了以编程方式触发事件的单独命名的方法，而不是jQuery.trigger()。

以下示例代码：

$(function() {
    $('select[name="country"]')
        .val('whatever')
        .trigger('change');
});

jQuery将选定的值从一种形式应用到另一种形式

2 个答案: