2016-04-12 2 views
1

Я не могу заставить свою функцию работать. Мне очень жаль, если это очень простая ошибка, я не смог найти ответ, и я только начинаю с JS.Использование JS для установки ввода только для чтения

Итак, я пытаюсь сделать так, чтобы при отправке заказа он блокировал все входы (только для чтения), как я могу исправить свой код?

<!doctype html> 
<html> 
<head> 
<style> 
a#nav0,a#nav1,a#nav2,a#nav3,a#nav4,a#nav5,a#nav6,a#nav7,a#nav8,a#nav9,a#nav10,a#nav11,a#nav12{color:blue; background-color:white; font-size:30px} 
</style> 
<script> 
function hide() { 
    var x = document.getElementsByTagName("input"); 
    x.readonly = "readonly"; 
} 
</script> 
<title>Garden Gnomes - Order</title> 
</head> 
<body style="background-color:lightblue"> 
<center> 
<a id="nav0"> | </a> <a href="home page.html" id="nav1"> Home </a> <a id="nav2"> | </a> <a href="about.html" id="nav3"> About us </a> <a id="nav4"> | </a> <a href="packages.html" id="nav5"> Packages </a> <a id="nav6"> | </a> <a href="prices.html" id="nav7"> Prices </a> <a id="nav8"> | </a> <a href="associates.html" id="nav9"> Associates </a> <a id="nav10"> | </a> <a href="order.html" id="nav11"> Order </a> <a id="nav12"> | </a> 
</center> 
<center> 
<br>  
<br> 
<form onsubmit="output.value='Submitted'" action="MAILTO:[email protected]?SUBJECT=Gardening order form" method="post" enctype="text/plain"> 
<legend> <font size="5"> Order a Package </font> </legend> 
<br> 
<br> 
Name: 
<input type="text" name="Name"> 
<br> 
<br> 
Package: 
<select name="Package"> 
    <option> Lawn Mowal </option> 
    <option> Property Cleanup </option> 
    <option> Lawn Mowal + Property Cleanup </option> 
    <option> Premium Property Cleanup </option> 
    <option> Premium Property Upgrade </option> 
</select> 
<br> 
<br> 
Quoted Price: $<input type="number" name="Price"> 
<br> 
<br> 
Land (in meters squared): <input type="number" name="Land Size">m<sup>2</sup> 
<br> 
<br> 
Email: <input type="email" name="Email"> 
<br> 
<br> 
Phone Number: <input type="number" name="Phone Number"> 
<br> 
<br> 
Address: <input type="text" name="Address"> 
<br> 
<br> 
<input type="submit" value="Submit order" onclick="hide()"> 
<br> 
<br> 
<output id="output"> </output> 
</form> 
</center> 
</body> 
</html> 
+1

Вы должны держать тег сценария после того, как элементы отображаются. т.е. до конца тега тела. –

+1

И еще, вы хотите «все» входы. var X станет массивом. – Aeldred

+0

@Mr_Green Я попробую, спасибо. – qwerty77asdf

ответ

3

Попробуйте заменить

x.readonly = "readonly"; 

с

x.readOnly = true; 

Обратите внимание, что O из readOnly является колпачков сейчас, и значение является логическим.

getElementsByTagName возвращает NodeList, а не узел. Вам необходимо итератировать их

function hide() 
{ 
    var x = document.getElementsByTagName("input"); 
    for (var counter = 0; counter < x.length; counter++) 
    { 
     x.item(counter).readonly = "readonly"; 
    } 
} 
+0

Я попробую, спасибо. – qwerty77asdf

+0

К сожалению, это не работает. – qwerty77asdf

+1

@ qwerty77asdf попробуйте этот полный код – gurvinder372

-1

Вместо того, чтобы читать только попытаться отключить.

document.getElementById("InputBoxID").disabled = true; 
0

Получить все входные теги и установить attribute..working ...

function hide() { 
    var x = document.getElementsByTagName("input"); 
    for (var counter = 0; counter < x.length; counter++) 
    { 
     x[counter].setAttribute("readonly","true"); 
    } 

} 
Смежные вопросы