2013-02-18 95 views
0

我想提出一個應用程序,它有一個按鈕,復位故障與事件監聽

現在這個復位按鈕需要的所有值重置爲默認值

我找到了一個例子:http://jsfiddle.net/RoryMcCrossan/b55Au/2/

但我不能得到這個工作在我的Index.cshtml 我想知道如果有人可以告訴我如何讓我的應用程序中的這項工作,也許把函數放在.js文件中,並在佈局或加載這個.js文件?

我index.cshtml類:

@{ 

ViewBag.Title = "Index"; 
} 


<script> 
    function resetInput1(e) { 
     document.getElementById('input1').value = document.getElementById('input1').defaultValue; 
    } 
    function resetInput2(e) { 
     document.getElementById('input2').value = document.getElementById('input2').defaultValue; 
    } 
    function resetSelect1(e) { 
     document.getElementById('select1').value = document.getElementById('select1').selectedIndex = 0; 
    } 


    document.getElementById("btn1").addEventListener('click', resetInput1, true); 
    document.getElementById("btn2").addEventListener('click', resetInput2, true); 
    document.getElementById("btn3").addEventListener('click', resetSelect1, true); 

</script> 

<form id="test"> 
    Input 1: <input type="test" id="input1" value="abcded" /><br><br> 

    Input 2: <input type="test" id="input2" value="xyz123" /><br><br> 

    Select 1: 
    <select id="select1"> 
     <option selected="selected">Please select...</option> 
     <option>Option #1</option> 
     <option>Option #2</option> 
     <option>Option #3</option> 
     <option>Option #4</option> 
    </select><br /><br /> 

    <input type="button" id="btn1" value="Reset Input #1" /><br><br>  
    <input type="button" id="btn2" value="Reset Input #2" /><br><br>  
    <input type="button" id="btn3" value="Reset Select #1" /><br><br> 
</form> 
+0

默認值是什麼意思?它在頁面加載時的價值? – BenM 2013-02-18 14:18:19

+0

看:http://jsfiddle.net/RoryMcCrossan/b55Au/2/ 你有「abcded2」爲輸入1,這是在頁面加載的值。當你編輯它爲「abcded22323」並點擊重置,它將被重置爲「abcded2」 – 2013-02-18 14:34:13

+0

代碼工作正常,但我不知道如何將它們放在我的代碼中正確的方式讓它工作! – 2013-02-18 14:34:57

回答

0

您的文檔加載完成之前分析你的腳本,這意味着當它試圖找到的ID,元素尚未創建,因此沒有事件偵聽器被添加。把你的標籤放在相應的html下面或者更好,把它放在一個外部的.js文件中,並在關閉body標籤之前引用它。

+0

謝謝!這是我正在尋找的答案 – 2013-02-19 08:36:55