Question

我有一个简单的Javascript函数，但它不在表单内部工作。它看起来像这样：

echo "<tr><td><form name='formfolder' method='POST' action='?module=pindah_dok_index' >";
echo "<input type=hidden name='id_debt' value='$_GET[id_debt]' />";
echo "move docs</td><td>";
echo "<input type='text' name='index1_dok' id='xcvbn' onkeyup='xcvbn()' style='width:80px;' required />";

但是当我在表单之前/之外放置输入#xcvbn时，它可以完美地运行。

我的Javascript功能很简单：

function xcvbn(){    
  var xx=document.getElementById("xcvbn");
  var x = xx.value;
  var str = x.replace(/[^0-9a-zA-Z\-_.]/g, ''); 
  var str = str.toUpperCase();
  xx.value = str;
}

Answer 1

您的input元素的ID与函数名称相同。

有些浏览器直接接受JS中的表单元素的id。请参阅下面的代码段（在FF中测试）。

＆＃13;

console.log(asdf.value);

＆＃13;

<form>
<input id="asdf" value="text" />
</form>

＆＃13;

所以它会产生冲突。这就是为什么没有触发功能的原因。为输入元素id和函数使用不同的名称。

最好你可以在函数参数中传递this对象，如下所示。

＆＃13;

function xcvbn(elem) {
  var x = elem.value;
  var str = x.replace(/[^0-9a-zA-Z\-_.]/g, '');
  var str = str.toUpperCase();
  elem.value = str;
}

＆＃13;

<tr>
  <td>
    <form name='formfolder' method='POST' action='?module=pindah_dok_index'>
      <input type=hidden name='id_debt' value='$_GET[id_debt]' />move docs</td>
  <td>
    <input type='text' name='index1_dok' id='elemId' onkeyup='xcvbn(this)' style='width:80px;' required />

＆＃13;

简单的javascript函数无法在表单内部工作

1 个答案: