Question

我正在使用Smarty Street的LiveAddress jQuery插件（2.4分支）。有时，表单加载时已经提供了地址。在页面加载时预加载地址验证的最佳方法是什么？

e.g。形式：

<input id="address" value="20 N. Main St" />
<input id="city" value="Greenville" />
<input id="state" value="SC" />
<input id="zip" value="29601" />

e.g。的javascript：

// set up Address Verification Service
var liveaddress = $("#DeliveryAddress").LiveAddress({
    key: "0000000000",
    autoVerify: true,
    submitVerify: false,
    invalidMessage: "Address Not Found. Click X to continue anyway.",
    addresses: [{
        id: 'DeliveryAddress',
        street: '#address',
        city: '#city',
        state: '#state',
        zipcode: '#zip'
    }]
});

到目前为止，我已经尝试过：

liveaddress.verify( 'DeliveryAddress' );

这确实会验证地址但不会更新验证按钮，所以显然它不会触发所有事件。这是调试模式显示的内容：

LiveAddress API jQuery Plugin version 2.4.11 (Debug mode)
Manually mapping fields given this data: 
Finished mapping address with ID: DeliveryAddress
EVENT: FieldsMapped (Fields mapped to their respective addresses)
EVENT: VerificationInvoked (Address verification invoked)
EVENT: RequestSubmitted (Request submitted to server)
EVENT: ResponseReceived (Response received from server, but has not been inspected)
EVENT: AddressWasValid (Response indicates input address was valid)
EVENT: AddressAccepted (Address marked accepted)
EVENT: Completed (All done)
EVENT: MapInitialized (Mapped fields have been wired up to the window, document, and UI)

实际上点击验证按钮会触发相同的事件。

Matt回答的最终解决方案：

liveaddress.on("MapInitialized", function(event, data, previousHandler) {
    previousHandler(event, data);
    liveaddress.verify( 'DeliveryAddress' );
});

Answer 1

要检查两件事：

在以编程方式更改任何字段的值后，需要触发change事件。确保在填充字段

change

从您的调试输出看起来，就像在初始化UI之前进行验证一样;在进行验证之前，请确保所有内容都已完成初始化。

Answer 2

我有完全相同的要求，我提出了这个解决方案，它将标记地址有效也显示绿色勾选，而不调用SmartyStreet（因为您正在加载已经验证的地址，所以为什么要再次呼叫？）如果客户试图更改地址，那么这也会很小心，然后它会触发验证。

我的项目是在ASP.NET中，因此我根据地址是新的还是现有来加载以下javascript，如果是新的我不加载此javascript，如果Exisitng我加载此脚本。

 <% if(!NewAddress){%>

          liveaddress.on("MapInitialized", function (event, data, previousHandler) {
             var Address = liveaddress.getMappedAddressByID('billing'); 
             Address.accept();
             $("a[data-addressid='billing']").removeClass('smarty-tag-grayed').addClass('smarty-tag-green');
        previousHandler(event, data);
       });
<%}%>

Answer 3

<强> working Demo

attr用于获取默认值，prop用于获取更改值

var get=$("#address");
    var defaulutValue=get.attr("value");  // to get default value
    var changeValue=get.prop("value");    // to get changed value

如何使用LiveAddress jquery插件验证默认值？

Matt回答的最终解决方案：

3 个答案: