Изменить значение формы ввода HTML с помощью JavaScript

Мой HTML-код:

<form action="Generator.klx" method="post" onsubmit="genarate('hiddenField')">
   <input type="hidden" id="hiddenField" name="hidden" value=""/>
   <input type="submit" name="submit"/>
</form>

мой JavaScript:

function genarate(hiddenField){
  var field = document.getElementById(hiddenField);
  field.value = "new Value";
 }

Но это просто не сработало:(. Кто-нибудь может сказать мне, где я был не прав?
Спасибо

Источник

1 ответ

Решение

Ваш код, указанный в кавычках, должен работать и работает в моих тестах с различными браузерами. (Я попробовал это локально, с помощью формы POST, но вы также можете попробовать это здесь: http://jsbin.com/ehoro4/1 Я изменил метод на GET так что вы можете увидеть результат в URL.)

Я думаю, что у вас есть что - то еще на странице с name или же id "hiddenField", кроме скрытого поля, которое вы указали. Если вы измените имя поля на "флугхорн" или что-то еще, что (гм) вряд ли будет где-то еще на вашей странице, это вполне может сработать. Это потому, что пространство имен используется getElementById (к сожалению) довольно многолюдно.

С другой стороны, вы уверены, что genarate появляется в глобальном масштабе? (Например, это вне всех других функций.) Потому что ваш onsubmit атрибут требует, чтобы genarate быть глобальным. Так что это работает:

<form action="#" method="get" onsubmit="genarate('hiddenField')">
   <input type="hidden" id="hiddenField" name="hidden" value=""/>
   <input type="submit" name="submit"/>
</form>
<script>
function genarate(hiddenField){
  var field = document.getElementById(hiddenField);
  field.value = "new Value";
}
</script>

но, например, это не будет:

<form action="#" method="get" onsubmit="genarate('hiddenField')">
   <input type="hidden" id="hiddenField" name="hidden" value=""/>
   <input type="submit" name="submit"/>
</form>
<script>
(function() { // Begin scoping function to avoid global symbols (not uncommon)
    function genarate(hiddenField){
      var field = document.getElementById(hiddenField);
      field.value = "new Value";
    }
})();
</script>

Также рекомендуем использовать отладчик ( нет оправдания тому, что в 2011 году здесь не использовались отладчики на стороне клиента), чтобы установить точку останова на genarate функционировать и пройти, чтобы увидеть, что происходит не так.

Источник

Crud .html

<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="JavaScript.js"></script>
</head>
<body>
<input type="text" name="name" id="name"  onfocus="opConfig.reloadPrice()">
<button type="button" onclick="myFun()">submit</button>
<button type="button" onclick="update()">update</button>
<br><br>
<p id="table"></p>
</body>
</html>

JavaScript.js

var arr = [];
var index;
function myFun()
{
var name = document.getElementById('name').value;
arr.push(name);
table();

}
function table(){
var text = "<table border=1><tr><th>username</th><th>action</th></tr>"
for (var i = 0; i < arr.length; i++) {
text+="<tr><td>"+arr[i]+"</td><td><button 
onclick=myDELE("+i+");>delete</button><button 
onclick=myEdit("+i+");>edit</button></td></tr>"
}
text+="</table>";
console.log(text);

document.getElementById('table').innerHTML = text;
tablehidden();
}

function myDELE(i)
{
var name = arr.splice(i,1);

// name.splice(i,1);
console.log(name);
table();
tablehidden();
}
function tablehidden(){
if (!arr.length) { document.getElementById('table').hidden=true; }
else{document.getElementById('table').hidden=false;}
}
function myEdit(i)
{
text = document.getElementById('name').value = arr[i];
         index = i;
}
function update(){
arr[index]=document.getElementById('name').value ;
table();
tablehidden();
}
Источник
Другие вопросы по тегам