文本输入的值不通过开发者应用程序显示

时间:2017-06-18 17:34:27

标签: jquery html5 cordova jquery-mobile phonegap

我正在使用Phonegap 6.5.0fixer.io创建基本货币转换应用程序。我遇到的问题是,通过我的Nexus 6p上的Phonegap应用程序查看应用程序时,设置为disabled文本输入的引用/转换值不可见。如果我通过桌面服务器查看页面,我会看到值。此外,如果我将输入作为测试启用,则没有任何更改,但如果我键入该字段,我可以确认我确实看到了该文本。

HTML

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
        <title>Currency Conversion</title>

        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
    </head>
    <body>
        <!-- The main page of the application -->
        <div id="page" data-role="page" data-theme="b">
            <div data-role="header">
                <h1>Currency Converter</h1>
            </div>
            <div id="content-main" class="ui-content" data-role="main">

                <form id = "currency-conversion" action="" method="POST">

                    <!-- Base Currency -->
                    <fieldset class="ui-field-contain">
                        <legend>Base Currency</legend>

                        <select id="base" name="base">
                            <option value="CAD" selected>CAD</option>
                            <option value="USD">USD</option>
                        </select>
                        <input id="base-value" name="base-value" type="text">
                    </fieldset>

                    <!-- Quote Currency -->
                    <fieldset class="ui-field-contain">
                        <legend>Quote Currency</legend>

                        <select id="quote" name="quote">
                            <option value="CAD">CAD</option>
                            <option value="USD" selected>USD</option>
                        </select>
                        <input id="quote-value" name="quote-value" type="text" disabled>
                    </fieldset>

                    <!-- Buttons -->
                    <div class="ui-grid-a">
                        <div class="ui-block-a"><button id="clear" data-theme="c">Clear</button></div>
                        <div class="ui-block-b"><button id="convert" type="submit" data-theme="b">Convert</button></div>
                    </div>

                </form>
            </div>
        </div>

        <!-- Scripts after page load -->
        <script type="text/javascript" src="cordova.js"></script>
        <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>

        <script type="text/javascript" src="js/convert.js"></script>
    </body>
</html>

的jQuery

$(document).ready(function () {
    $("#convert").click(function() {
        // Gather input
        var base = $("#base").val();
        var quote = $("#quote").val();

        $.ajax({
            type: "POST",
            url: "https://api.fixer.io/latest?callback=?&base=" + base + "&symbols=" + quote,
            data: {},
            async: true,
            dataType: "jsonp",
            crossOrigin: true,
            crossDomain: true,
            success: function(response) {
                console.log(response.rates[quote]);

                var result = ($("#base-value").val() * response.rates[quote]);
                $("#quote-value").val("" + result.toFixed(2));
            },
            error: function (error) {
                console.log(error);
            }
        });
    });

    // Clear the form input fields
    $("#clear").click(function() {
        $("#currency-conversion").find("input[type=text]").val("");
    });
});

0 个答案:

没有答案