0

我是 jQuery 新手,这是我想问的问题。下面是HTML代码,

<div>
  <!-- Div One -->
  <div class="search_tag">
    <span>Show search From</span>
  </div>

  <!-- Div Two -->
  <div class="search">
    <form>
      ......
      <input class="submit" type="submit" value="submit" />
    </form>
  </div>
</div>

现在,当页面加载时,我希望显示 Div 2 ie<div class="search">和 Div 1 ie<div class="search_tag>隐藏。当我点击表单提交时,页面将刷新,我希望表单隐藏 ie<div class="search"><div class="search_tag">显示出来。当我点击 Div one ie 时,<div class="search_tag">我希望 Div 2 ie<div class="search">表单显示出来,然后我会提交另一个表单。我需要用 jQuery 来做这件事。

重要提示我不需要表单按钮事件,我需要刷新页面的表单提交事件。

4

5 回答 5

0

尝试

jQuery(function($){
    $('.search form input[value="submit"]').click(function(){
        $(this).closest('.search').hide();
    })

    $('.search_tag').click(function(){
        $('.search').toggle()
    });
})

演示:小提琴

于 2013-05-15T05:11:58.023 回答
0
<span id="toggleSearch"></span>
<input id="submit" class="submit" type="button" value="submit" />

$('#toggleSearch').onclick(function() {
  $('.search').toggle();
  $('.search_tag').toggle();
});


$('#submit').onclick(function() {
  $('.search').toggle();
  $('.search_tag').toggle();
});
于 2013-05-15T05:01:01.583 回答
0

你可以试试这个

 // please set ID attribute for all control

**HTML**
<div>
   <!-- Div One -->
   <div class="search_tag" id="search">
   <span id="show">Show search From</span>
   </div>

   <!-- Div Two -->
   <div class="search" id="submitButton">
     <form>
     ......
     <input class="submit" type="button" value="submit" id="submit" />
   </form>
  </div>
</div>


function pageLoad()
{
  $('#search').hide();


  $('#submit').click(function(){

    $('#submitButton').hide();
    $('#search').show();

  })

  $('#show').click(function(){

    $('#submitButton').show();        

  })



}

请尝试一下,如果您遇到任何问题,请告诉我...

于 2013-05-15T06:08:51.167 回答
0

好的,这接近您想要的,我认为它会有所帮助。(你想要的东西很容易从中得到。)

<div id="search_tag">
    Show search form
</div>

<div id="search">
    <form id="myform">
        <input type="text"/>
        <input type="button" value="submit"/>
    </form>
</div>

<!-- jQuery -->

var form_submitted = false;
refresh();

$('#myform').click(function() {
    form_submitted = true;
    refresh();
});

$('#search_tag').click(function() {
    form_submitted = false;
    refresh();
});

function refresh() {
    $('#search').toggle(!form_submitted);
    $('#search_tag').toggle(form_submitted);
}

工作示例:http: //jsfiddle.net/FZfxN/

于 2013-05-15T05:06:52.587 回答
0

试试这个:

$(document).ready(function(){
$('.search_tag').hide();
$('.search_tag').click(function(){ $(this).toggle(); $('.search').toggle();});
$('.search').click(function(){ $(this).toggle(); $('.search_tag').toggle(); });
});

这是我的演示

您还可以通过添加以下代码在每次单击提交按钮时执行一些 AJAX 来发送表单数据,而无需刷新:

 $('#demoform').submit(function(e){
    e.preventDefault(); // Prevent from following the link
    $.post('mytest.php'); // and just post here if you are using php
});

Ajax 演示在这里

于 2013-05-15T05:27:16.037 回答