单击按钮-jQuery/JavaScript时显示表格

Display the table when click the button - jQuery/JavaScript

本文关键字：显示 表格 JavaScript 按钮 -jQuery 单击      更新时间：2023-09-26

请建议如何在页面加载时隐藏html内部表，然后单击搜索按钮，表将只显示结果。我不想展示空桌子。请看下面我试过的代码。

但可以肯定的是，点击按钮后页面会被刷新。

$(document).ready(function() {       
    $("#historylist").hide();
    $("#historysearch").click(function() {
        $("#historylist").show();
    });
    // }
});    
<table id="searchTbl" width="800" >
<tr>
    <td valign="top">Release No</td>
    <td valign="top">
        <input type="text" name="releaseNo" value="" style="width:200" />
    </td>
    <td valign="top"><input type="button" value="Search" onClick="commit()" style="width:80" id="historysearch"/></td>
</tr>
<br /><br />
    <table border="1" cellpadding="2" cellspacing="0" id="historylist">
    <tr>
        <th><font size="-1">Header1</font></th>
        <th><font size="-1">Header2</font></th>
        <th><font size="-1">Header3</font></th>
        <th><font size="-1">Header4</font></th> 
        <th><font size="-1">Header5</font></th>
    </tr>
    </table>
</table>

JavaScript:

function commit(){
    document.menu.cmd.value='search';
    document.menu.submit();       
}

当单击按钮时，它会显示该表，并再次隐藏该表。

$(document).ready(function() { 
$("#historylist").hide(); 
$("#historysearch").click(function(e) { 
    e.preventDefault(); 
    $("#historylist").show(); 
    commit(); // moved from the onClick attribute });
});

$("#historysearch").click(function(e) {
    e.preventDefault();
    $("#historylist").show();
    commit(); // moved from the onClick attribute
});

http://api.jquery.com/event.preventDefault/

相关文章：