用Javascript更改輸入值

標題看起來很簡單，但我需要幫助。用Javascript更改輸入值

我有一個字段輸入「郵件」，它的價值是零，直到用戶填寫起來的一種形式。好吧，提交按鈕的點擊，我調用函數的validate（），它是：

function validate(){ 
    var email=document.getElementById("email"); 
    if(!(/[\w-\.]{3,15}@([\w-]{2,}\.)*([\w-]{2,}\.)[\w-]{2,4}/.test(email))) { 
     email.setAttribute('value','Insert a correct email'); 
     email.style.border="2px solid red"; 
    } else { 
     alert("Valid field"); // This is to test it works 
     email.style.border="2px solid #63ce40"; 
     this.form.submit(); 
    } 
    }

我想在這裏做的是，如果插入的電子郵件不符合要求（無效），變化「插入正確的電子郵件」輸入的值。

如果該字段爲空，我點擊提交，它完美地工作，但如果我插入文字，然後點擊提交，唯一的變化將是該領域得到2px的紅色邊框，但沒有文字的變化。

我想知道我必須這樣做，當我點擊提交寫了錯誤的電子郵件被刪除，用文字代替「插入正確的電子郵件」。

輸入是：

<li> 
    <input type="text" id="email" name="email" 
    value="" onfocus="this.value=''" size="40"/> 
</li>

而且我使用的提交按鈕：

<input id="bsubmit" type="button" value="Submit" 
name="submit" onclick=";this.disabled=true;validate(); 
this.disabled=false;"/>

謝謝。

來源

2013-03-09 fperezdp

**'email.value =「重試！你的豬！';'**請注意，'setAttribute（）'與設置一個元素的屬性（大多數情況下）不一樣。 – 2013-03-09 17:09:19

我會考慮使用佔位符來輸出錯誤消息，而不是直接在輸入中寫入錯誤消息。 – 2013-03-09 17:11:04

是的，這是一個糟糕的設計......您將覆蓋用戶剛輸入的電子郵件地址，而不是讓他們有機會查看它，查看問題並進行更正。 – 2013-03-09 17:11:56

這是很好的，你試圖使用setAttribute可言，因爲它是一個重要的方法，但問題是，你不想修改value屬性在這種情況下，這是DOM的一部分，但您要修改<input>元素的value屬性。

email.value = 'Insert a correct email';

http://jsfiddle.net/XJZwm/

來源

2013-03-09 17:09:27

也謝謝你們，你們倆都給了我完全合適的解決方案。你的解釋也有幫助，我會記住:) – fperezdp 2013-03-09 17:13:00

@ user2151981 - 這是答案*，因爲它回答了問題*，而不僅僅是*提供瞭解決問題的方法*。爆炸藥丸實際上告訴你一些有用的東西。這應該被接受（你也應該注意）。 – 2013-03-09 17:51:00

完成;出於這個原因，我剛開始投票。無論如何，因爲我沒有15點以上的聲望，我無法贊成。你介意在jsFiddle上檢查我的代碼嗎？你會發現，即使你插入了正確的電子郵件，它也會說這是錯誤的...我看不到它失敗的地方：/ – fperezdp 2013-03-09 17:59:09

試試這個email.value = 'Insert a correct email';代替email.setAttribute('value','Insert a correct email');

來源

2013-03-09 17:09:34

太棒了，它完美的工作！ – fperezdp 2013-03-09 17:12:12

請考慮在字段旁邊或警告框中顯示錯誤消息，而不是刪除用戶剛輸入的電子郵件地址。 – 2013-03-09 17:12:51

很高興它有幫助，那麼也許你可以投票這是正確的答案。 – 2013-03-09 17:13:50

用Javascript更改輸入值

回答

相關問題