Question

我正在使用jtable显示cd专辑，用户可以通过cd name和cd category过滤和搜索。更改后重新加载表的代码在按下按钮时使用.click事件。我想使用按钮搜索cd Name并使用onchange事件按类别过滤记录，而不是每次都按下按钮。是否可以使用onchange触发.click？

使用Javascript：

//Re-load records when user click 'load records' button. 
        $('#LoadRecordsButton').click(function (e) { 
            e.preventDefault(); 
            $('#AlbumTableContainer').jtable('load', { 
                CDTitle: $('#name').val(), 
                catID: $('#catID').val()
            }); 
        }); 

        //Load all records when page is first shown 
        $('#LoadRecordsButton').click();

HTML：

<form> 
        CD Name: <input type="text" name="cdName" id="cdName" /> 
        Category:  
        <select id="catID" name="catID" onchange="WhatDoIPutHERE"> 
            <?php
                echo "<option>Select an option</option>";
                while ($row = mysql_fetch_array($category)){
                    $id = $row["catID"];
                    $cat = $row["catDesc"];
                    echo "<option value=\"$id\">$cat</option>";
                }
            ?>
        </select> 
        <button type="submit" id="LoadRecordsButton">Load records</button> 
    </form>

Answer 1

$('#cdName, #catID').on('change', function() {
   $('#LoadRecordsButton').click(); 
});

这将注册文本框和下拉列表的更改事件以触发click事件。

然而，在单独的函数中使用load功能并在每个事件上调用此函数可能会更好：

function loadjTable() {        
   $('#AlbumTableContainer').jtable('load', { 
       CDTitle: $('#name').val(), 
       catID: $('#catID').val()
   });
}

$('#LoadRecordsButton').click(function (e) {
   e.preventDefault();
   loadjTable();
});
$('#cdName, #catID').on('change', function() {
   loadjTable();
});

这可能会使您的代码更容易理解。

从下拉列表中调用.click事件

1 个答案: