尽管使用了jQuery.noConflict(),但仍无法使用2个版本的jQuery使我的上传表单工作

时间:2015-01-06 15:03:47

标签: php jquery forms twitter-bootstrap

我有一个网页,其中有2种不同的表格,第一个用于上传图片(它应该提供新上传图片的链接),第二个是“常规”表单,允许将产品添加到数据库,我在其中使用第一个表单给出的链接。问题是我使用bootstrap的jQuery,而上传表单使用1.7.2版本(不用说,有冲突。)

一旦我点击“发送”按钮,它应该会出现一个加载栏并显示“100%”,然后是图像URL,而上传过程则在另一个名为“upload.php”的文件中完成 问题是,即使我使用'jQuery.noConflic();'它仍然继续将我重定向到upload.php,那里没什么可看的,但我找不到问题...

以下是上传表单:

<form id="myForm" action="upload.php" name="upload" method="post" enctype="multipart/form-data">
  <div class="form-group">
    <label class="col-md-4 control-label" for="filebutton">Uploader une image</label>
    <div class="col-md-3">
      <input id="filebutton" name="filebutton" class="input-file" type="file">
      <div id="progress">
        <div id="bar"></div>
        <div id="percent">0%</div >
        <br />

        <div id="alerte"></div>
      </div>
    </div>

    <div class="form-group">
      <label class="col-md-3 control-label" for="envoyer"></label>
        <div class="col-md-3">
          <button type="file" value="envoyer" id="formenvoyer" name="myfile" class="btn btn-primary">Envoyer</button>
        </div>
    </div>
  </div>

</form>

这是PHP文件:

<?php
$output_dir = "img/";


if(isset($_FILES["myfile"]))
{
 //Filter the file types , if you want.
 if ($_FILES["myfile"]["error"] > 0)
 {
   echo "Error: " . $_FILES["file"]["error"] . "<br>";
 }
 else
 {
      //move the uploaded file to uploads folder;
 move_uploaded_file($_FILES["myfile"]["tmp_name"],$output_dir. $_FILES["myfile"]["name"]);

  echo "<p>Uploaded File :<br />http://grindhouseleather.esy.es/admin/img/".$_FILES["myfile"]["name"]."</p>";
 }

}
?>

这是JS:

jQuery = jQuery.noConflict();
jQuery(document).ready(function()
{

var options = { 
beforeSend: function() 
{
    $("#progress").show();
    //clear everything
    $("#bar").width('0%');
    $("#alerte").html("");
    $("#percent").html("0%");
},
uploadProgress: function(event, position, total, percentComplete) 
{
    $("#bar").width(percentComplete+'%');
    $("#percent").html(percentComplete+'%');


},
success: function() 
{
    $("#bar").width('100%');
    $("#percent").html('100%');

},
complete: function(response) 
{
    $("#alerte").html("<font color='green'>"+response.responseText+"</font>");
},
error: function()
{
    $("#alerte").html("<font color='red'> ERROR: Impossible d'uploader les fichiers</font>");

}

}; 

 $("#myForm").ajaxForm(options);

});

我错过了什么? 提前谢谢!

1 个答案:

答案 0 :(得分:0)

您不应将jQuery用于jQuery.noConflict();。将其更改为:

jq = jQuery.noConflict();

原因是:

jQuery = jQuery.noConflict();

以上代码没有区别。