Jquery/AJAX中的菜单项选择函数调用问题

我想调用下面的AJAX Javascript函数(Code-1)选择并单击名为"Log Report" (Code-2)的菜单项，并在页面的html文本框中填充test.txt的结果。

下面的代码-1可以读取text.txt，我希望它被调用或调用时，我选择菜单项选项名为日志报告。谁能建议我如何才能使我的工作下面的代码。我如何在菜单项日志报告中调用代码1函数并在文本框中填充文本?

p。S: Code 2下拉UI可以通过复制test.txt中的代码并保存为test.html来查看。在IE或Firefox中打开。

编码1

      <script type="text/javascript">  
function  contentDisp()
{
    $.ajax({
    url : "test.txt",
    success : function (data) {
    $("#contentArea").html(data);
    }
    });
}
 </script>

代码2

<html lang="en">
<head>
<meta charset="utf-8">
<title>Test screen</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
<link href="style.css" rel="stylesheet" type="text/css">
<script>
$(function() {
$( "#menu" ).menu();
});
</script>
<style>
.ui-menu { width: 230px; }
</style>
</head>
<body>
<ul id="menu">
<li>Server</li>
<li>Logs
<ul>
<li>Log Report</li>
</ul>
</li>
</html>

最简单的方法是给"Log Report" li指定一个ID，并在上面附加一个click事件，就像这样:

<ul id="menu">
<li>Server</li>
<li>Logs
<ul>
<li id="log-report-link">Log Report</li>
</ul>
</li>

在script标签中像这样:

<script>
    $( "#menu" ).menu();
    $("#log-report-link").click(function(){
        contentDisp();
    });
</script>

希望有帮助!

相关内容

最新更新

热门标签：