Question

Readonly vs disbled我的代码有什么问题？

  <select id="A" onchange="change_val(A,B)">
    <option value="A">A</option>
    <option value="B">B</option>
    <option value="C">C</option>
    <option value="D">D</option>
    </select>

<input type="text" id="B" value="Hello first time"/>


function change_val(selectbox,input_filed) {
  var sel = document.getElementById(selectbox),
  lbl = document.getElementById(input_filed);

  lbl.disabled = (sel.selectedIndex !== 0);
  if(sel.selectedIndex === 0) {
  lbl.value = 'Hello first time';
  } else {
  lbl.value = sel.options[sel.selectedIndex].value;
  }
}

当我们更改选择框时，此脚本可以正常使用“DISABLED”输入属性。但是当我尝试READONLY输入属性时因为我需要提交但不允许更改的数据所以我改变了这个函数：

function change_val(selectbox,input_filed) {
  var sel = document.getElementById(selectbox),
  lbl = document.getElementById(input_filed);
if(sel.selectedIndex !== 0){var readonly='readonly';}
  lbl.readonly = readonly;
  if(sel.selectedIndex === 0) {
  lbl.value = 'Hello first time';
  } else {
  lbl.value = sel.options[sel.selectedIndex].value;
  }
}

READONLY输入字段不起作用。输入字段still editable

任何人都知道代码有什么问题？我对readonly属性的误解是什么？

Answer 1

你的外壳是错的，我相信它应该是一个布尔值。

lbl.readOnly = true;

编辑：审核完DOM后，我认为readOnly元素上实际上没有<select>属性。你不能隐藏实际选择而只是显示一个只读文本框吗？

Answer 2

该属性名为readOnly（大写O）：

lbl.readOnly = (sel.selectedIndex !== 0);

您还应该将字符串传递给函数：

<select id="A" onchange="change_val('A','B')">

DEMO

Readonly vs disabled我的代码有什么问题？

2 个答案: