将输入从隐藏更改为文件

时间:2014-10-11 17:45:49

标签: javascript html

我在更改javascript中的输入类型时遇到问题。 当我从隐藏更改为文本是正常的并且正确显示但是当我更改为文件输入时没有显示。

<script type="text/javascript">
  function show(x,y) {
    if (document.getElementById(y).checked) {
        document.getElementById(x).setAttribute('type', 'file');
    } else {
        document.getElementById(x).setAttribute('type', 'hidden');
    }

}
</script>

3 个答案:

答案 0 :(得分:2)

/*JQUERY
function show(x,y){
$(y).change(function() {
    $("#txtAge").text(this.checked);
    if(this.checked) $(x).attr('type','text')
    else $(x).attr('type','file');
});
}
show('#a','#isAgeSelected');*/
//JAVASCRIPT
function show(x,y,z){
var typedefault=document.getElementById(x).type;
document.getElementById(y).onchange=function(){
    document.getElementById('txtAge').innerText=this.checked;
    if(this.checked){
        document.getElementById(x).type = z;
    } else {
       document.getElementById(x).setAttribute('type',typedefault);
    }
};
}
show('a','isAgeSelecteda','text');
show('b','isAgeSelectedb','text');
show('c','isAgeSelectedc','file');

/*
function supportsFileInput() {
  var dummy = document.createElement("input");
  dummy.setAttribute("type", "file");
  return dummy.disabled === false;
}
alert(supportsFileInput());
*/
<input id="isAgeSelecteda" type="checkbox">
<input id="isAgeSelectedb" type="checkbox">
<input id="isAgeSelectedc" type="checkbox">
<p id="txtAge"></p>
<input type="hidden" id="a">
<input type="file" id="b">
<input type="hidden" id="c">

答案 1 :(得分:1)

试试这个:

function show(x, y) {
    if (document.getElementById(y).checked) {
        document.getElementById(x).type = 'text';
    } else {
        document.getElementById(x).type = 'file';
    }
}

Fiddle1

function show(x, y) {
    if (document.getElementById(y).checked) {
        document.getElementById(x).type = 'text';
    } else {
        document.getElementById(x).type = 'hidden';
    }
}

Fiddle2

Fiddle3

答案 2 :(得分:1)

下面的代码应该可以使用。

Javascript代码

document.getElementById(selector).setAttribute("type","file");

jQuery代码

$(selector).attr('type', 'file');

示例代码

<强> HTML

<input type="checkbox" id="chkTest"  onclick="myFunction()">
<input type="hidden" id="hdnFld" />

Java脚本

function myFunction() { 
    if(document.getElementById("chkTest").checked)   { 
        document.getElementById("hdnFld").setAttribute("type","text");
    } else{
        document.getElementById("hdnFld").setAttribute("type","file");
    }                               
}