两个单独的函数，但是我希望它们同时被初始化

Question

I have these 2 separate functions, each work and are initialized by 2 different input buttons which are used to pass two different Country Names to create a html table comparison of the 2 countries from a SQL database. 我有这2个单独的函数，每个函数都由2个不同的输入按钮初始化，这些按钮用于传递两个不同的国家/地区名称，以从SQL数据库创建两个国家/地区的html表比较。

How can I rewrite this to initialize both function together with 1 button not 2? 我该如何重写此代码以使用1个按钮（而不是2个）来初始化两个功能？

    <script type="text/javascript">

        function display_results_table() {
            $("medal_table").empty();
            $('<table id = "results_table">').appendTo('#medal_table');
            $.get("sam2.php", { Country_1: $('#Country_1').val(), Country_2: $('#Country_2').val(), queryType: $('#differentOptions').val() }, 

        function (results_obtained) {

            $('<tr><td>Rank</td>' +
            '<td>Country Name</td>' +
            '<td>Gold</td>' +
            '<td>Silver</td>' +
            '<td>Bronze</td>' +
            '<td>Total</td></tr>').appendTo('#results_table');

            for (var i = 0; i <= results_obtained.length; i++) {
                $('<tr><td>' + (i+1) + '</td>' + 
                '<td>' + results_obtained[i].country_name + '</td>' +
                '<td>' + results_obtained[i].gold + '</td>' +
                '<td>' + results_obtained[i].silver + '</td>' +
                '<td>' + results_obtained[i].bronze + '</td>' +
                '<td>' + results_obtained[i].total + '</td></tr>').appendTo('#results_table');              
            }   
        },'json');

        $('</table>').appendTo('#medal_table');
        }

        function display_cyclist_results_table() {
            $("cyclist_table").empty();
            $('<table id = "cyclist_results_table">').appendTo('#cyclist_table');
            $.get("sam3.php", { Country_1: $('#Country_1').val(), Country_2: $('#Country_2').val(), queryType: $('#differentOptions').val() }, 

        function (cyclist_results_obtained) {

            $('<tr><td>Name</td></tr>').appendTo('#cyclist_results_table');

            for (var j = 0; j <= cyclist_results_obtained.length; j++) {
                $('<tr><td>' + cyclist_results_obtained[j].iso_id + '</td>' +
                '<td>' + cyclist_results_obtained[j].name + '</td></tr>').appendTo('#cyclist_results_table');
            }

        },'json');

        $('</table>').appendTo('#cyclist_table');
        }

    </script>
    <title>sam.php</title>
</head>
<body>
    <form name="form">
        <table>
            <tr><td><input name="Country_1" id="Country_1" value="GBR" type="text"></td></tr>
            <tr><td><input name="Country_2" id="Country_2" value="USA" type="text"></td></tr>
            <tr><td><input type="button" value="Medal Comparison" onClick="display_results_table()"/></td>
                <td><input type="button" value="Cyclist Comparison" onClick="display_cyclist_results_table()"/></td></tr>
        </table>
    </form>
    <div id="medal_table"></div>
    <div id="cyclist_table"></div>

</body>

Answer 1

Use on() or click() function on a new button (or any element you want): on()新按钮（或所需的任何元素click()上使用on()或click()函数：

$('#button').click(function() {
   functionOne();
   functionTwo();
});

Answer 2

Wrap it into a function 包装成一个函数

function call_everybody(){
    display_results_table();
    display_cyclist_results_table();
}

So your button just need this 所以你的按钮只需要这个

<input type="button" value="Cyclist Comparison" onclick="call_everybody()"/>

Answer 3

Use a jQuery handler instead of inline onclick handlers: 使用jQuery处理程序，而不是内联onclick处理程序：

$('#button').click(function() {
    display_results_table();
    display_cyclist_results_table();
});

Inline handlers separate the event registration from the event handler for no good reason. 内联处理程序没有充分的理由将事件注册与事件处理程序分开。 This is easier to maintain. 这更容易维护。

This just requires a way to identify the button (eg an ID added to it): 这仅需要一种识别按钮的方法（例如，添加了ID的按钮）：

<input id="button1" type="button" value="Medal Comparison" />

两个单独的函数，但是我希望它们同时被初始化

问题描述

3 个解决方案

解决方案1
2 2015-04-21 11:23:27

解决方案2
1 已采纳 2015-04-21 11:25:56

解决方案3
1 2015-04-21 11:31:47

两个单独的函数，但是我希望它们同时被初始化

问题描述

3 个解决方案

解决方案1 2 2015-04-21 11:23:27

解决方案2 1 已采纳 2015-04-21 11:25:56

解决方案3 1 2015-04-21 11:31:47

解决方案1
2 2015-04-21 11:23:27

解决方案2
1 已采纳 2015-04-21 11:25:56

解决方案3
1 2015-04-21 11:31:47