我的叠加层的<form>标签在加载时消失,而提交按钮当然不起作用</form>

时间:2011-06-05 15:31:22

标签: submit overlay bpopup

我正在使用bPopup在叠加层中加载表单。表单基本上是隐藏在页面中的表单,通过单击页面上的按钮,叠加显示在顶部,其中包含表单。

我以前在另一个页面中使用此代码并且它工作正常但是想要覆盖路线,因为我觉得用户体验更好。

所以会发生什么: 叠加层加载完美,所有字段都可见,但提交按钮不执行任何操作。 使用firebug,我查看了叠加层的代码,并意识到我的开始和结束标记已从div中消失。

我检查并且它们在隐藏时出现..所以我猜测在加载叠加层时bPopup会发生一些事情。

我在这方面找不到任何东西,转向社区。

由于

以下是代码示例:

我加载的页面中的div:

<div id="fileuploadbox">
  <div id="fileupload_div" class="contentcontainer">
          <div class="headings alt">
                <h2>Upload a file</h2>
           </div>
           <div class="contentbox">
             <form action="**mycontroller**" method="post" enctype="multipart/form-data">        
             <p><span class='label'>File:</span><input type="file" name="file" value="" id="uploader" size="34"  /></p>
             <p><span class='label'>Description:</span><input type="text" name="description" value="" id="smallbox2" class="inputbox" maxlength="250"  /></p>
            <p><span class='label'>&nbsp;</span><input type="submit" name="" value="Upload file" class="btn"  />
    </form>  
           </div> <!-- content box -->
</div> <!-- contentcontainer -->
</div> <!-- fileuploadbox -->

按钮自己:

  <a href="#" class="fileuploadpop">
    <div id="fileuploadpop">   
         Upload a file         
    </div>
  </a>

Javascript:

<script language="javascript">
    $(document).ready(function(){
            $("a.fileuploadpop").bind('click', function(){
             $("#fileuploadbox").bPopup();
             return false
            });
        });
</script>

1 个答案:

答案 0 :(得分:0)

您提供的代码在我的mac Firefox和Chrome中使用bPopup工作正常。提交按钮有效!

可能与我未定义的btn类有关,或者您可能会尝试将其置于裸骨页面中以首先测试bPopup以跟踪和解决任何其他冲突。