在Google Chrome和Safari浏览器上无法更改输入类型

Change of input type is not working on Google Chrome and Safari browsers

本文关键字：输入 类型 Chrome Google Safari 浏览器      更新时间：2023-09-26

我正试图在点击按钮后更改隐藏在输入类型文件中的输入类型。该代码在mozilla firefox和internet explorer上运行良好，但在Google Chrome和Safari浏览器上不起作用。以下是我的代码：

<script type="text/javascript">
function hide()
{
    $(document).ready(function()
    {
        $('#att').hide();
        $('#change').hide();
        $('#change1').hide();
        document.getElementById('fileatt').type='file';
    })
} 
<input type="text" name="att" value="<?php echo $name; ?>" id="att" disabled="disabled" size="12" style="float:left;">
<input name="fileatt" id="fileatt" type="hidden" size="12" style="float:left;">
<input type="button" name="browse" id="change" value="Browse" style="float:left;">
<input type="button" id="change1" value="Change" onclick="hide()">

禁用的文本框包含以前从数据库中获取的值。添加了值为"浏览"的按钮，使其看起来像输入类型的文件。单击"更改"按钮，我希望文本字段和浏览按钮被隐藏，并显示输入类型文件。在Firefox和Internet Explorer上一切正常。但我面临的问题是，在Chrome和Safari上，文本框和浏览按钮成功消失，但输入类型文件没有出现。

您不能更改input的type，因此这是无效代码：

document.getElementById('fileatt').type='file';

使用两个元素，隐藏一个，显示另一个，切换它们。

点击此处阅读更多信息：
使用jQuery 更改输入字段的类型

尝试以下操作：

function hide()
    {
        $(document).ready(function()
        {
            $('#att').hide();
            $('#change').hide();
            $('#change1').hide();
            $('#fileatt').attr('type', 'file');                //document.getElementById('fileatt').type='file';
        })
    }

尝试这个

$('#fileatt').attr('type', 'file');

代替

document.getElementById('fileatt').type='file';
相关文章：