Jquery .val总是为下拉列表返回相同的值

时间:2015-12-03 05:05:55

标签: javascript php jquery html ajax

以下是我的ajax多图片上传代码

<script>
$(document).ready(function()
{

    var settings = {
        url: "upload.php",
        method: "POST",
        allowedTypes:"jpg,png",
        fileName: "myfile",
        formData: {"projectId":$('#project_name').val()},
        multiple: true,
        onSuccess:function(files,data,xhr)
        {
            $("#status").html("<font color='green'>Upload is success</font>");
        },
        afterUploadAll:function()
        {
            alert("all images uploaded!!");
        },
        onError: function(files,status,errMsg)
        {       
            $("#status").html("<font color='red'>Upload is Failed</font>");
        }
    }
    $("#mulitplefileuploader").uploadFile(settings);

});
</script>

以下是我的文本字段值

<select class="form-control" name="project_name" id="project_name">
<option value="1">Project 1</option>
<option value="2">Project 2</option>                                    
</select>

以下是我的文件上传器div

<div id="mulitplefileuploader">Upload</div>

上面的div使用了一个js文件,可以ajax上传几个图像到一个文件夹,它的工作。但是当我尝试发送数据(选定的下拉值)时,尽管我使用jquery启动它,但它始终为1。

document.ready部分可能有问题。

由于

当我更改下拉列表的值并使用图片上传时,项目ID始终为 1 ,尽管我更改了下拉列表的值并尝试使用

获取值
$('#project_name').val()

如何更改我的代码,以便在执行上传图像的脚本时,它将通过id project_name,selected.val

获取当前选定的下拉列表

谢谢!

3 个答案:

答案 0 :(得分:3)

使用

$('#project_name option:selected').val()

获取所选选项的值

现在,如果您想获得选项文本,即项目1,项目2等,则需要编写

$('#project_name option:selected').text()

<强>更新

问题实际上是您的代码设置。您已在settings内创建了$(document).ready。因此,即使您更改selected option,也不会更改settings期间定义的document ready内的值。您需要更新设置onchange或以其他方式更新。

答案 1 :(得分:3)

将上传内容绑定到表单的提交

$(document).ready(function()
{
$('form').submit(function(e){
e.preventDefault()
    var settings = {
        url: "upload.php",
        method: "POST",
        allowedTypes:"jpg,png",
        fileName: "myfile",
        formData: {"projectId":$('#project_name option:selected').val()},
        multiple: true,
        onSuccess:function(files,data,xhr)
        {
            $("#status").html("<font color='green'>Upload is success</font>");
        },
        afterUploadAll:function()
        {
            alert("all images uploaded!!");
        },
        onError: function(files,status,errMsg)
        {       
            $("#status").html("<font color='red'>Upload is Failed</font>");
        }
    }
    $("#mulitplefileuploader").uploadFile(settings);

});
});

答案 2 :(得分:1)

尝试$("#project_name option:selected").val();