Javascript $（“tabs”）.tabs（）中断文件上载_Javascript_Jquery

Javascript $（“tabs”）.tabs（）中断文件上载

javascript jquery

Javascript $（“tabs”）.tabs（）中断文件上载,javascript,jquery,Javascript,Jquery,我有一个简单的文件上传，我想使用href将其包含在jquery选项卡中。不幸的是，它打破了标签代码如下。如果我注释掉$（“#tabs”）.tabs（）；在包含代码中，它起作用；如果不是，则不会进行文件上载文件上载代码包含在名为upload.html的文件中，如下所示： <html> <body> <form name="registration" action="../php/recordInteraction.php" method="post"

我有一个简单的文件上传，我想使用href将其包含在jquery选项卡中。不幸的是，它打破了标签

代码如下。如果我注释掉$（“#tabs”）.tabs（）；在包含代码中，它起作用；如果不是，则不会进行文件上载

文件上载代码包含在名为upload.html的文件中，如下所示：

<html>
<body>
  <form name="registration" action="../php/recordInteraction.php" method="post" 
      accept-charset="utf-8" target="_self"  enctype="multipart/form-data" >  
  <div> 
     <input type="file" name="fileToUpload" id="fileToUpload" >
     <p><label for="submit"> Hi</label>
        <input type="submit" name="submit" id="submit" value="Upload" > 
     </p> 
  </div> 
 </form> 
</body> </html>

嗨

包含jquery代码small.html的是：

<html lang="en">
<head>
  <meta charset="utf-8">
  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
  <script>
  $(function() { 
     $( "#tabs" ).tabs();
   }); 
  </script>
</head>
<body>

<div id="tabs" >
  <ul>
    <li><a id="upload" href="upload.html">Upload</a></li>
  </ul>
</div>

</body>
</html>


$（函数（）{
$（“#制表符”）.tabs（）；
});

这里有一个简单的jQuery解决方案。单击链接时，jQuery单击文件上载按钮

jQuery将被注释

$（'#uploadButton'）。单击选项卡时，单击（函数（）{//）
$（'#fileToUpload'）。单击（）；//假装已单击文件输入
});





你好

上帝所写的是正确的。您也可以通过直接提交表单来完成
<html>
<body>
  <a href="#" id="uploadButton">Browse for files</a>
  <br/><br/>
  <form name="registration" action="../php/recordInteraction.php" method="post" 
  accept-charset="utf-8" target="_self"  enctype="multipart/form-data" **id="fileSubmitForm"**>  
  <div> 
     <input type="file" name="fileToUpload" id="fileToUpload" >
     <p><label for="submit"> Hi</label>
        <input type="submit" name="submit" id="submit" value="Upload" > 
    </p> 
  </div> 
 </form> 
</body> </html>

$('#uploadButton').click(function() { // when the tab is clicked

  $('#fileSubmitForm').submit(); // pretend the file input was clicked

});





嗨

$（'#uploadButton'）。单击选项卡时，单击（函数（）{//）
$（'#fileSubmitForm'）.submit（）；//假装单击了文件输入
});
我没有正确解释这个问题。我发布了新的代码来说明这个问题。我没有正确地解释这个问题。我已经发布了新代码来说明这个问题。@LenB，这个代码也适用于您的选项卡。只需将$（'#uploadButton'）
更改为$（'#upload'）
。结果表明问题是由我在输入元素上使用表单属性引起的。这会阻止文件实际提交。