基本的html/php/jquery gui

oalias 发布于 2019-03-09 function 最后更新 2019-03-09 14:35 0 浏览

我正在寻找放在一起使用HTML和PHP的gui来加载目录中的数据。 我想要一个侧面菜单栏上的链接,将.php文件中的数据加载到主体区域中,但我还没有完全理解如何去做。任何帮助,你可以提供将不胜感激。

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="common/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="common/jquery-1.9.1.js"></script>
<!-- Functions -->
<script type="text/javascript">
$(document).ready(function(){
    function dataSelect(proj) {
        alert(proj.id);
        $.ajax({
            url: "core/catalogue.php?p="+proj,
                cache: false,
                success: function(html){
                    $("#dataSelect").html(html);
                }
        });
    }            
});
</script>
</head>
<body>
<form id="form1" name="form1" method="post" action="">
    <div id="topheader">
        <div class="logo">
        <div class="head"> Whatever </div>
       </div>
    </div>
    <div id="body_area">
        <div class="left">
            <div class="left_menutop"></div>
            <div class="left_menu_area">
                <div class="left_menu_title">Projects:</div>
                <div align="right">
                    <a href="#" class="left_menu" id="someProject" onclick="dataSelect(this)">Some Project</a><br />
                </div>
            </div>      
        </div>
        <div class="midarea" id="body">
            <div class="body_textarea">
                <div align="justify" id="dataSelect"></div>
            </div>
        </div>
    </div>
</form>
</body>
</html>
谢谢您的帮助!
已邀请:

ysit

赞同来自:

如果有其他人想要完成相同的事情,这里的代码是有效的:

<!-- Functions -->
<script type="text/javascript">
$(document).ready(function(){
$(".left_menu").click(function(){
        val = this.id;      
        $.ajax({
            url: "core/catalogue.php?p="+this.id,
                cache: false,
                success: function(html){
                    $("#dataSelect").html(html);
                }
        });
    });//end $(".left_menu").click
});//end $(document).ready
</script>
</head>