0

我想要一个在将鼠标悬停在我的图像上时显示的按钮，然后当我单击该按钮时，我希望出现一个表单，但是当我单击“选择文件”时我不希望它消失

<script type="text/javascript">

$("#profile_pic, #edit_pic").hover(
   function(){
      $('#edit_pic').removeClass('hidden');
   }
);
$("#edit_pic").click(function (){
 $("#upload_form").removeClass('hidden');
});

</script>

<html>

<div id="profile_pic">
</div>

<div id="edit_pic">
</div>

<div id="upload_form">
  //upload image form using cakephp
            <?php 
            echo $this->Form->create('Account', array('enctype' => 'multipart/form-data', 'url' => array('controller' => 'images', 'action' => 'before_crop', 'accounts' , $current_user['id']))); 
            echo $this->Form->input('image_relpath', array('type' => 'hidden'));
            echo $this->Form->input('Account.image', array('type' => 'file', 'label' => false));
            echo $this->Form->end('Upload');
         ?>&nbsp;
</div>

</html>

我无法判断我的 jquery 是否错误，或者 cakephp 是否自动将事情搞砸了，但是一旦我单击“选择文件”（由表单创建的按钮），整个表单就会消失。

4

3 回答 3

0

我可以很容易地发现您的代码中的一些问题。

首先在 HTML 上，不要忘记在标签的属性中打开和关闭引号。

其次，在你的 jQuery 选择器上，当引用一个 ID 时，永远不要忘记使用尖 号 #。

尝试修复它们，看看会发生什么。

你也可以使用这个例子：

<style type="text/css">
#edit_pic, #upload_form {
    display: none;
}
</style>

<script type="text/javascript">
$("#profile_pic").mouseenter(function(){
    $("#edit_pic").show();
});

$("#edit_pic").click(function(){
    $("#upload_form").show();
});
</script>

小心，因为这样，#edit_pic按钮一旦显示就永远不会消失。

于 2012-11-19T19:26:26.663 回答
0

您的代码中没有任何内容表明事物消失的原因。很明显你的例子并不完整。如果您可以提供一个完整的示例来重现您遇到的错误，我们可以尝试找出问题所在并解决问题。

于 2012-11-19T19:48:24.517 回答
0

在我的 .click 函数中添加“return false”解决了这个问题。

$("#edit_pic").click(function (){
  $("#upload_form").removeClass('hidden')
  return false;
});
于 2012-11-19T19:49:17.260 回答