Question

我使用jQuery修改了页面上div元素的内容，并插入了来自不同页面的内容，如下所示：

插入内容的网页

<?php include('../includes/overall/overallHeader.php'); ?>

<section class="content-header">
    <h1>Einsatzliste</h1>
</section>

    <script type="text/javascript">
        $(document).ready(function(e){
            var $sidebarNavigationList = $('#sidebarNavigationList');
            $($sidebarNavigationList).find('a').on('click', function(e){
                e.preventDefault();
                $('#mainContent').load('incidents.php')
            });
        });
    </script>

<section class="content">
    <div id="mainContent">

    </div>
</section>

<?php include('../includes/overall/overallFooter.php'); ?>

内容来自

的网页

<?php include('../core/init.php'); ?>
<?php include('../core/db_connect.php'); ?>
<?php include('../core/init.php'); ?>

<form action="" method="post">
    <div class="field">
        <label for="latitude">Latitude</label>
        <input type="text" name="latitude" id="latitude" autocomplete="off">
    </div>
    <div class="field">
        <label for="longitude">Longitude</label>
        <input type="text" name="longitude" id="longitude" autocomplete="off">
    </div>
    <input type="submit" id="submit" value="Einsatz anlegen">
</form>

补充工具栏导航内容

<div class="navbar-default sidebar" role="navigation">
    <div class="sidebar-nav navbar-collapse" id="sidebarNavigationList">
        <ul class="nav in" id="side-menu">
            <li><a href="" id="pageIncidents">Einsatzliste</a></li>
        </ul>
    </div>
</div>

脚本正确地按预期将内容加载到div“mainContent”中。这工作很好。只要我点击提交按钮，div标签中的所有内容就会消失。当我使用Chrome开发工具检查网站结构时，标记为空。

php文件中没有任何奇怪的代码可以调用它。我对jQuery比较新。我将如何有效地检查错误或我应该从哪里开始。调试这个我不是很有经验。

Answer 1

我刚刚找到答案。我完全走错了路。整个设置完全正常，脚本按预期工作。问题是＆＃34;提交＆＃34;的表单输入类型。提交会导致页面完全重新加载。因为我没有在第一次加载时设置事件页面的初始显示，所以整个表格消失了＃34;。最终它只是重新加载了index.php。将类型更改为按钮解决了问题。

div的内容在提交后消失

1 个答案: