Question

我有一个从SELECT表单元素传递选定值的基本任务，但它只传递select语句的第一个选项，而不是实际选择的选项。

这是FORM SELECT部分：

    <p>Grade Level:
        <select id="gradeLevel">
            <option value="">Please select...</option>
            <option value="primary">Primary</option>
            <option value="levelk">Level K</option>
            <option value="level1">Level 1</option>
            <option value="level2">Level 2</option>
            <option value="level3">Level 3</option>
            <option value="level4">Level 4</option>
            <option value="level5">Level 5</option>
            <option value="level6">Level 6</option>
            <option value="level7">Level 7</option>
            <option value="level8">Level 8</option>
        </select>
    </p>
    <p>Test:
        <select id="dropTest">
            <option value="1">One</option>
            <option value="2">Two</option>
            <option value="3">Three</option>
        </select>
    </p>

这是传递formData部分中的值的函数。如您所见，我尝试了两种传递值的变体：

<script type="text/javascript">
    <?php $timestamp = time();?>
    $(function() {
        $('#file_upload').uploadifive({
            'auto'             : true,
            'checkScript'      : 'check-exists.php',
            'formData'         : {
                                   'timestamp' : '<?php echo $timestamp;?>',
                                   'token'     : '<?php echo md5('unique_salt' . $timestamp);?>',
                                   'first'     : $("#firstName").val(),
                                   'last'      : $("#lastName").val(),
                                   'level'     : $("#gradeLevel").val(),
                                   'drop'      : $("#dropTest option:selected").val()
                                 },
            'queueID'          : 'queue',
            'uploadScript'     : 'uploadifive.php',
            'onUploadComplete' : function(file, data) { console.log(data) }
        });
    });
</script>

这是我的控制台转储，您可以在其中看到两个SELECT值是第一个选项，而不是选中的选项：

 /Smith_John/1array(7) {
 ["timestamp"]=>
 string(10) "1418341524"
 ["token"]=>
 string(32) "1d8a1c4e5db6c89dba913c0c620231ce"
 ["first"]=>
 string(4) "John"
 ["last"]=>
 string(5) "Smith"
 ["level"]=>
 string(0) ""
 ["drop"]=>
 string(1) "1"
 ["filename"]=>
 string(9) "tr205.pdf"
 }

现在有趣的部分......如果我输入任何一个JQuery命令$（＆＃34; #levelLevel＆＃34;）。val（）或$（＆＃34; #dropTest选项：selected＆＃34; ）.val（）进入控制台，它会拉出正确的选定值。

我完全迷失了......某种程度上正在拉动正确的值，但传递的参数不是？

Answer 1

问题是$("#gradeLevel").val()和$("#dropTest option:selected").val()的值在此脚本执行时被解析，因此它们始终设置为第一个（默认）元素。更改其他项目不会影响它们，因为它们已经设置好了。

根据this doc，您应该这样做：

$(function() {
    $('#file_upload').uploadifive({
        'auto'             : true,
        'checkScript'      : 'check-exists.php',
        'onUploadStart'    : function(file) {
            // set formData here.
            $('#file_upload').uploadifive('settings', 'formData', {
                'timestamp' : '<?php echo $timestamp;?>',
                'token'     : '<?php echo md5('unique_salt' . $timestamp);?>',
                'first'     : $("#firstName").val(),
                'last'      : $("#lastName").val(),
                'level'     : $("#gradeLevel").val(),
                'drop'      : $("#dropTest option:selected").val()
            });
        },
        'queueID'          : 'queue',
        'uploadScript'     : 'uploadifive.php',
        'onUploadComplete' : function(file, data) { console.log(data) }
    });
});

相关问题：Uploadify: Dynamic FormData does not change

Answer 2

您准备好$("#gradeLevel").val()文件了。

在那一刻，你在[select]中选择了第一个选项，对吗？

在选择正确的选项后，您应该获得值。

Answer 3

使用......

$("#dropTest").val()

......或......

$("#dropTest option:selected").text()

首先会为您提供所选的关联选项值。第二个选项将为您提供选项的文本。

参考： HERE

Answer 4

试试这个：

$("button").on("click", function()
{
        $('#file_upload').uploadifive({
            'auto'             : true,
            'checkScript'      : 'check-exists.php',
            'formData'         : {
                                   'timestamp' : '<?php echo $timestamp;?>',
                                   'token'     : '<?php echo md5('unique_salt' . $timestamp);?>',
                                   'first'     : $("#firstName").val(),
                                   'last'      : $("#lastName").val(),
                                   'level'     : $("#gradeLevel").val(),
                                   'drop'      : $("#dropTest option:selected").val()
                                 },
            'queueID'          : 'queue',
            'uploadScript'     : 'uploadifive.php',
            'onUploadComplete' : function(file, data) { console.log(data) }
        });
    });
});

如果您希望在更改选择选项时发生这种情况，请尝试使用

$("select").on("change", function()
{
  //Your code here
}

基本上这将允许javascript在DOM加载后执行。

JQuery没有传递SELECT表单参数

4 个答案: