将div设置为post方法的结果页面的目标容器

zer*_*rey 4 html post

我有一个div标签,也分为两个div.这是代码:

<div>
<div id="search">
<form id="try" method="post">
Batch: <input id="batch" name="batch" type="text"/>Dept: <input id="dept" name="dept" type="text"><input type="submit"/>
</div>
<div id="receiver">

</div>
</div>
Run Code Online (Sandbox Code Playgroud)

我使用post方法在名为"search"的div中放置了一个搜索选项.我想要做的是当我点击提交按钮时,接收值的页面将出现在名为"receiver"的div上.

这可能吗?如果是的话,请帮忙..

Rad*_*own 6

你的方法是:

1 - 最简单的 - 而不是div - 使用这样的IFrame

<div id="search">
  <form id="try" method="post" target="receiver" action="url-to-server-Page">
     Batch: <input id="batch" name="batch" type="text"/>
     Dept: <input id="dept" name="dept" type="text" />    
     <input type="submit"/>
  </form>
  </div>
  <iframe name="receiver" id="receiver"></iframe>
</div>
Run Code Online (Sandbox Code Playgroud)

在这种情况下的缺点是,在这种情况下从url到server-page的搜索结果是一个完整且独立的HTML页面,它嵌套在你的搜索页面中.它不受父页面样式的影响,并且它们之间用于JavaScript操作的通信相当简洁.

2 - 使用一些JavaScript技能,您可以使用AJAX.网上有很多库可以帮助你在很少的代码行中完成它.jQuery是最简单的,虽然它是我最不喜欢的... http://jquery.com/

3 - 使用完整的往返

  <div id="search">
    <form id="try" method="post" target="receiver" action="url-to-server-Page">
       Batch: <input id="batch" name="batch" type="text"/>
       Dept: <input id="dept" name="dept" type="text" />    
      <input type="submit"/>
    </form>
    <div id="receiver">
        <?php if (isset($_POST['batch']) && isset($_POST['dept'])){
                  //display search results here.
              }
        ?>
    </div>
 </div>
Run Code Online (Sandbox Code Playgroud)