Question

我将此作为下一个和后退按钮

这是下一个按钮：

$(document).on('click', '#next_form', function () {
        emailAdress = $("#email").val();
        $(".column_1").flip({
        direction: 'rl',
        });
        $(".column_2").flip({
        direction: 'lr',
        });
});

后退按钮：然后我可以恢复翻转并再次插入值：

$(document).on('click', '#back_form', function () {
    $(".column_1").revertFlip();
    $(".column_2").revertFlip();
    $("#email").val(emailAdress);
    console.log(emailAdress);
});

但输入字段没有显示我控制台日志时的值，它似乎运行完美但它确实显示...任何想法为什么？

Answer 1

您需要从var Fname, emailAdress, phoneNumber;中取出document.ready。

Answer 2

基本问题是当它翻转时，javascript没有注册动作，所以它不知道div元素有变化，并且有新内容。所以当我把它们翻回来时，同样的事情发生了。

我发现的解决方案是监听DOM上的突变。

   var observer = new MutationObserver(function(mutations, observer) {
        // fired when a mutation occurs
        console.log(mutations, observer);
        // ...
        $('#streetAddres').val(streetAddress);
        $("#numberPH").val(phoneNumber);
        $("#emailAd").val(emailAdress);
        $("#state").val(state);
        $("#name").val(Fname);
        $("#city").val(city);
        $("#zip").val(zip);

    });

    observer.observe(document, {
        subtree: true,
        attributes: true
        //...
    });

此示例侦听对文档及其整个子树的DOM更改，它将触发对元素属性的更改以及结构更改。

我发现了一个非常有用的例子，关于堆栈溢出的更多信息来源于：Is there a JavaScript/jQuery DOM change listener?你需要向下滚动一下才能看到它。

输入字段未显示其设置值

2 个答案: