Question

我正在尝试让我的控制台打印input字段type file的内容。但是，它没有这样做。它实际上表现得像提交表单一样，尽管此时表单上没有附加任何操作。谁能解释为什么我无法获得所需字段的值？

JS

$("#submit").on("click", function(){
    var image = $("#dept_image").val();
    console.log(image);
})

HTML

<form enctype="multipart/form-data" method="post" id="departments" class="view">
    <fieldset>
        <label for="dept_name">Department Name:</label>
        <input type="text" name="dept_name" id="dept_name" />
    </fieldset>
    <fieldset>
        <label for="dept_image">Image:</label>
        <input type="file" name="dept_image" id="dept_image" />
    </fieldset>
    <button name="submit" id="submit">Submit</button>
</form>

Answer 1

通过捕获事件并对其采取行动来阻止默认操作 -

$("#submit").on("click", function(event){
    event.preventDefault(); // prevents the default action of the submit
    var image = $("#dept_image").val();
    console.log(image);
})

在提交页面中没有任何内容会被控制台记录，因为您正在“离开”它以加载“新”页面（即使它本身就是这样）。现在，您可以通过广告AJAX来执行您需要做的任何提交操作。

控制台不打印输入字段的内容

1 个答案: