javascript - jQuery 事件处理程序仅适用于 Firefox

标签 javascript jquery

我正在为名为 Rail Baron 的棋盘游戏创建一个简单的基于 Web 的查找实用程序。有两个文本输入连接到 jQuery autoComplete,这似乎工作得很好。对于输入的任何更改事件,都会显示美元金额 - 代表两个城市之间旅行的返回。

change()事件处理程序在 Firefox 中调用,但在其他浏览器中不调用。 在 IE 中不起作用,所以我认为这不是 webkit 问题。寻找解决方法或了解为什么会发生这种情况。 完整申请可访问 http://paislee.net/railbaron 。谢谢!

依赖项,加载于 <head> :

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>

相关标记:

<form id="payoffForm" action="#">
                <fieldset>
                    <legend>
                        <strong>Payoff Lookup</strong>
                    </legend>
                    <label for="from">From:</label>
                    <input id="from" type="text">
                    <label for="to">To:</label>
                    <input id="to" type="text">
                    <div id="result">$</div>
                </fieldset>             
            </form>

我的 JavaScript,在关闭之前加载 </body>标签:

<script type="text/javascript">
            var chart; // small csv file in memory

            // this updates the dollar amount displayed
            function updatePayoff() {

                var result;
                var from = $("#from").val();
                var to = $("#to").val();

                var from_i = chart[0].indexOf(from);
                var to_i = chart[0].indexOf(to);
                result = chart[to_i + 1][from_i] * 1000;

                $("#result").html( result ? "$" + result : "$");

            }

            // attach event handlers
            $("#from").change(function() {
                updatePayoff();
            });

            $("#to").change(function() {
                updatePayoff();
            });

            // entry point
            $(document).ready(function() {
                $.ajax({
                    url : "./payoffs.csv",
                    cache : false,
                    success : function(result) {
                        chart = CSVToArray(result);
                        $("#from").autocomplete({
                            source : chart[0]
                        });
                        $("#to").autocomplete({
                            source : chart[0]
                        });
                    }
                });
            });

            // parsing my csv file into autocomplete array
            function CSVToArray(strData, strDelimiter) {
                // ..implementation..
            }

</script>

完整申请可在http://paislee.net/railbaron获取。谢谢!

最佳答案

查看 jQuery UI 自动完成的 select打回来。这完全未经测试,但试试这个:

        /* REMOVE
        $("#from").change(function() {
            updatePayoff();
        });

        $("#to").change(function() {
            updatePayoff();
        });
        */

        $(document).ready(function() {
            $.ajax({
                url : "./payoffs.csv",
                cache : false,
                success : function(result) {
                    chart = CSVToArray(result);
                    $("#from").autocomplete({
                        source : chart[0],
                        select: function() {
                            updatePayoff();
                        }
                    });
                    $("#to").autocomplete({
                        source : chart[0],
                        select: function() {
                            updatePayoff();
                        }
                    });
                }
            });
        });

关于javascript - jQuery 事件处理程序仅适用于 Firefox,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8651727/

相关文章:

javascript - 以 getbounds 和相关问题为中心的 Leaflet map

javascript - 使用数组两个元素查找并存储数组一的索引,并将数组一的所有索引存储在数组 3 中

jquery - CSS3 过渡 transform3d

javascript - 我正在使用 dropzone js. 用于文件上传

javascript - 从 css 类动画显示/隐藏

javascript - 我无法让容器 <div> 的内容正确居中

javascript - 如何在每次加载页面时只重新加载一次页面

javascript - Window.open 作为模态弹出窗口?

javascript - 查询 : how to add <li> in an existing <ul> with json data

javascript - 使用 javascript 在函数中传递多个参数的更简单方法