Question

我正在使用money.js库创建一个小型货币转换脚本，并遇到了.append（）;部分。以下是我到目前为止的情况：

<script type="text/javascript">
$(document).ready(function () {

    function pfxCurrencyConverter() {
        //get the users options from the form and store in variables
        var pfxFromCurrency = $('#pfx-from-currency').val();
        var pfxToCurrency = $('#pfx-to-currency').val();
        //set base options
        fx.base = pfxFromCurrency
        fx.settings = {
            from: pfxFromCurrency
        };
        //  get the amount input by the user
        var inputAmount = $('#pfx-input-amount').val();

        // Load exchange rates data via the cross-domain/AJAX proxy:
        $.getJSON('http://openexchangerates.org/latest.json', function (data) {
            // Check money.js has finished loading
            if (typeof fx !== "undefined" && fx.rates) {
                fx.rates = data.rates;
                fx.base = data.base;
            } else {
                // If not, apply to fxSetup global:
                var fxSetup = {
                    rates: data.rates,
                    base: data.base
                }
            }
            var convertedValue = fx.convert(inputAmount, {to: pfxToCurrency});

            $("#currencies").append("<li>New Value" + convertedValue + "</li>");
        });
    } //end pfxCurrencyConverter
    $(document).ready(function () {
        pfxCurrencyConverter();
    });
</script> 

</head>
<!-- output form for user to populate -->

<!-- Output the front end form, include external stylesheet and define customisable css -->

</head>
<!-- output form for user to populate -->
<body>
<form method="get" onsubmit="return pfxCurrencyConverter();">
Amount: <input type='text' id='pfx-input-amount' /><br />
From: <select id='pfx-from-currency'>
    <option>Please Choose</option>
    <option>GBP</option>
</select><br />
To: <select id='pfx-to-currency'>
    <option>Please Choose</option>
    <option>USD</option>
</select><br />
<input type='submit' value='Convert' />
</form>
<ul id="currencies"></ul>
</body>
</html>

我在提交按钮后面的html中也有这个，只用一个字符串就可以了，但是一旦我添加+ convertedValue就停止工作

<script>document.write("New Value" + convertedValue);</script>

非常感谢任何帮助

Answer 1

问题是在从.append()返回值之前调用了getJson()。将.append()放在.getJson()内解决了问题。这有效：

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
        <script src="http://josscrowcroft.github.com/money.js/money.js"></script>
        <script type="text/javascript">

            function ConvertMoney(to, from, amt) {
                // Load exchange rates data via the cross-domain/AJAX proxy:
                $.getJSON('http://openexchangerates.org/latest.json',
                        function (data) {
                            // Check money.js has finished loading:
                            if (typeof fx !== "undefined" && fx.rates) {
                                fx.rates = data.rates;
                                fx.base = data.base;
                            } else {
                                // If not, apply to fxSetup global:
                                var fxSetup = {
                                    rates: data.rates,
                                    base: data.base
                                };
                            }

                            var result = "<li>" + fx.convert(amt, { from: from, to: to }) + "</li>";
                            $("#result").append(result);
                        });
            }

            $("#convert").live("click", function () {
                var from = $("#pfx-from-currency").val();
                var to = $("#pfx-to-currency").val();
                var amt = $("#pfx-input-amount").val();

                ConvertMoney(to, from, amt);
            });

$(document).keypress(function(e) {
    if(e.keyCode == 13) {
          var from = $("#pfx-from-currency").val();
                var to = $("#pfx-to-currency").val();
                var amt = $("#pfx-input-amount").val();

                ConvertMoney(to, from, amt);
    }
});

        </script>
    </head>
    <body>
    Amount:
    <input type='text' id='pfx-input-amount' /><br />
    From:
    <select id='pfx-from-currency'>
        <option>Please Choose</option>
        <option>GBP</option>
    </select><br />
    To:
    <select id='pfx-to-currency'>
        <option>Please Choose</option>
        <option>USD</option>
    </select><br />
    <input type='button' id="convert" value='Convert' />
    <ul id="result">
    </ul>
</body>
</html>

Answer 2

看起来你有一个用分号终止的对象

var convertedValue = fx.convert(inputAmount, {to: pfxToCurrency; });

无效，请尝试将其更改为

var convertedValue = fx.convert(inputAmount, {to: pfxToCurrency });

我也希望

var pfxToCurrency = document.getElementById('pfx-to-currency').value

而不仅仅是

var pfxToCurrency = document.getElementById('pfx-to-currency')

Answer 3

看起来你有一个额外的<script>标签：

<script type="text/javascript">

$(document).ready(function(){
<script type="text/javascript">

Answer 4

请确保正确关闭Document ready功能（**结束）

$(document).ready(function () {

    ........
    .......... 
          });
        } //end pfxCurrencyConverter
    **});**
    $(document).ready(function(){
    pfxCurrencyConverter();
    });

jQuery - .append（）不起作用

4 个答案: