1

我目前正在尝试构建一个 jquery 移动应用程序。我有一个指向结果页面的表单，我附加了一个函数，该函数可以提取一些 json 并根据提交的表单计算一些数字。我的问题是，当显示结果页面时，它不会显示实际的计算结果，直到您刷新页面。

我对为什么会发生这种情况进行了一些研究，发现它归结为 JQM 通过 ajax 加载页面。当我将 data-ajax="false" 添加到表单时，结果页面工作正常但是我真的想使用 jqm 在结果页面上提供的过渡效果，因为它要么没有效果，但表格有效，要么效果和表格确实有效，肯定有办法做到这一点吗？

结果页面形式：

<form action="results.html" method="get" id="calculator" data-ajax="true" data-transition="flip">

然后在结束正文标记之前的结果页面上，我调用此脚本：

$('#resultsPage').live('pageinit', function(event) {
    getFigures();
});


function getFigures() {

    var propertyValue = getUrlVars()["propertyValue"];
    var quoteType = getUrlVars()["quoteType"];

    console.log(propertyValue);
    console.log(quoteType);

    $.getJSON(serviceURL + 'calculator.php?value=' + propertyValue, function(data) {

        figures = data.figures;
        $.each(figures, function(key, val) {

            //console.log(figure);
            //console.log('Key: ' + key + '  Val: ' + val);

            if (quoteType == 'buying') {

                if (key == 'total') {
                    $('#tfoot').append('<tr><th scope="row">' + key + ' </th><td><strong>&pound;' + val + '</strong></td></tr>');
                } else if (key != 'value') {
                    $('#tbody').append('<tr><th scope="row">' + key + ' </th><td>&pound;' + val + '</td></tr>');
                }

            } else {

                if (key == 'total') { // Total is wrong need to filter results from server for quoteType
                    $('#tfoot').append('<tr><th scope="row">' + key + ' </th><td><strong>&pound;' + val + '</strong></td></tr>');
                } else if (key != 'completion' && key != 'coal' && key != 'local' && key != 'landRegistry' && key != 'stampDuty') {
                    $('#tbody').append('<tr><th scope="row">' + key + ' </th><td>&pound;' + val + '</td></tr>');
                }

            }

        });

        $('#value').append('&pound;' + data.figures.value);

    });

    //$('#figureList').listview('refresh');

}

有谁知道我如何使用过渡效果并且仍然有工作形式？

4

2 回答 2

0

您可以在提交表单之前添加一个验证，您可以在其中保留您的逻辑，然后像通常那样使用 ajax 提交表单。

这是一个例子： http ://shadym.blogspot.in/2011/03/client-side-form-validation-using.html

希望这可以帮助！

于 2013-03-12T08:49:33.537 回答
0

如果要使用 jquery 过渡效果，则只能使用data-transition属性

前任。数据过渡=“淡入淡出”

于 2014-01-06T21:47:37.117 回答