2013-08-27 58 views
0

我有一個JavaScript文件,我創建它的工作如下: - 它將驗證在我的html表單的字段中輸入的名稱和電子郵件。如果電子郵件或名稱無效,則JavaScript會向用戶發出警報,並警告他所輸入的電子郵件或名稱無效。在JavaScript中刪除onBlur標記?

無論如何,此警報將POP操作向上「的onblur」。(當光標退出名字和電子郵件領域)

我想刪除「的onblur」的標籤。我希望驗證在填表完成時發生,當用戶單擊「提交」時。

如何做到這一點?用哪個標籤我必須替換「onBlur」? 順便說一句我嘗試用「onClick」替換「onBlur」:當我點擊該字段填充它時,警報出現。

這是JavaScript在我的HTML放置在頭部和/ head標籤之間**

<script language=javascript> 
<!-- 

function ValidateAll() 

{ 

if(CheckName(document.dForm.name.value) == false) return false; 

if(CheckEmail(document.dForm.email.value) == false) return false; 

return true; 

} 



function StripSpacesFromEnds(s) 

{ 



while((s.indexOf(' ',0) == 0) && (s.length > 1)) 

{ 

    s = s.substring(1,s.length); 

} 

while((s.lastIndexOf(' ') == (s.length - 1) && (s.length > 1))) 

{ 

    s = s.substring(0,(s.length - 1)); 

} 

if((s.indexOf(' ',0) == 0) && (s.length == 1)) s = ''; 

return s; 

} 



function IsItPresent(s,explanation) 

{ 



s = StripSpacesFromEnds(s); 

if(s.length) return s; 

alert('Please enter ' + explanation + '.'); 

return ''; 

} 



function CheckName(s_name) 

{ 



s_name = IsItPresent(s_name,'your name'); 

if(! s_name) return false; 

var i = s_name.indexOf(' ',0); 

while(i > -1) 

{ 

    s_name = s_name.substring(0,(i + 1)) + 

     s_name.substring((i + 2),s_name.length); 

    i = s_name.indexOf(' ',0); 

} 

s_name = s_name.toLowerCase(); 

var s = new String(s_name.substring(0,1)); 

s = s.toUpperCase(); 

s_name = s + s_name.substring(1,s_name.length); 

i = s_name.indexOf(' ',0); 

if(i == (s_name.length - 1)) i = -1; 

var ts = new String(""); 

var j = 0; 

while(i > -1) 

{ 

    i++; 

    j = i + 1; 

    s = s_name.substring(i,j); 

    s = s.toUpperCase(); 

    ts = ''; 

    if(i > 0) ts = s_name.substring(0,i); 

    s_name = ts + s + s_name.substring(j,s_name.length); 

    i = s_name.indexOf(' ',j); 

    if(i == (s_name.length - 1)) i = -1; 

} 

document.dForm.name.value = s_name; 

return true; 

} 



function CheckEmail(s_email) 

{ 



s_email = IsItPresent(s_email,'your email address'); 

if(! s_email) return false; 

var i = s_email.indexOf(' ',0); 

while(i > -1) 

{ 

    s_email = s_email.substring(0,i) + 

     s_email.substring((i + 1),s_email.length); 

    i = s_email.indexOf(' ',0); 

} 

document.dForm.email.value = s_email; 

if((s_email.length < 6) || 

    (s_email.indexOf('@',0) < 1) || 

    (s_email.lastIndexOf('@') != s_email.indexOf('@',0)) || 

    (s_email.lastIndexOf('@') > (s_email.length - 5)) || 

    (s_email.lastIndexOf('.') > (s_email.length - 3)) || 

    (s_email.lastIndexOf('.') < (s_email.length - 4)) || 

    (s_email.indexOf('..',0) > -1) || 

    (s_email.indexOf('@.',0) > -1) || 

    (s_email.indexOf('[email protected]',0) > -1) || 

    (s_email.indexOf(',',0) > -1)) 

{ 

    alert('The email address "' + s_email + '" is not valid.'); 

    return false; 

} 

return true; 

} 

// --> 

</script> 

這是HTML表單(無頭/ head標籤之間的JavaScript

<html> 
<head> 
<style type=text/css> 
.inputtext { width: 300px; height:30px; } 

<!-- 
.button { 
display:block; 
font-weight:bold; 
font-size:18px; 
font-family:Calibri; 
color:#009933; 
background-color:#ffffff; 
width:150px; 
text-align:center; 
padding:4px; 
border-top: 1px solid #b2b2b2; 
border-bottom: 1px solid #b2b2b2; 
border-left: 1px solid #b2b2b2; 
border-right: 1px solid #b2b2b2; 

} 
--> 
</style></head> 

<form name="dForm" action="script.cgi" method="POST"> 
<div align=center> 
<Table border=0><tr><td> 
<table border=0> 

<tr> 
<td valign=top><h3><font face=calibri color=#009933>Full name<font face=calibri color=red>*</font> </h3></td> 
<td valign=top><input onBlur="CheckName(document.dForm.name.value)" name="name" type="text" class=inputtext></td> 
</tr> 

<tr> 
<td valign=top><font face=calibri color=#009933><h3>Email address<font face=calibri color=red>*</font></h3></td> 
<td valign=top><input onBlur="CheckEmail(document.dForm.email.value)" name="email" type="text" class=inputtext></td> 
</tr> 

<tr> 
<td valign=top><font face=calibri color=#009933><h3>Select your gender</h3></font></td> 
<td valign=top><font face=calibri><input type="radio" name="gender" value="Male"> Male&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp<input type=radio name=gender value=Female> Female</font></td> 
</tr> 

<tr> 
<td valign=top><font face=calibri color=#009933><h3>Select your age</h3></font></td> 
<td valign=top><select name="age" size=1> 
       <option value=Below18>Below 18</option> 
       <option value=18>18</option> 
       <option value=19>19</option> 

       <option value=20>20</option> 
       <option value=21>21</option> 
       <option value=22>22</option> 
       <option value=23>23</option> 
       <option value=24>24</option> 
       <option value=25>25</option> 
       <option value=26>26</option> 
       <option value=27>27</option> 
       <option value=28>28</option> 
       <option value=29>29</option> 

       <option value=30>30</option> 
       <option value=31>31</option> 
       <option value=32>32</option> 
       <option value=33>33</option> 
       <option value=34>34</option> 
       <option value=35>35</option> 
       <option value=36>36</option> 
       <option value=37>37</option> 
       <option value=38>38</option> 
       <option value=39>39</option> 

       <option value=40>40</option> 
       <option value=41>41</option> 
       <option value=42>42</option> 
       <option value=43>43</option> 
       <option value=44>44</option> 
       <option value=45>45</option> 
       <option value=46>46</option> 
       <option value=47>47</option> 
       <option value=48>48</option> 
       <option value=49>49</option> 

       <option value=50>50</option> 
       <option value=51>51</option> 
       <option value=52>52</option> 
       <option value=53>53</option> 
       <option value=54>54</option> 
       <option value=55>55</option> 
       <option value=56>56</option> 
       <option value=57>57</option> 
       <option value=58>58</option> 
       <option value=59>59</option> 

       <option value=60>60</option> 
       <option value=61>61</option> 
       <option value=62>62</option> 
       <option value=63>63</option> 
       <option value=64>64</option> 
       <option value=65>65</option> 
       <option value=66>66</option> 
       <option value=67>67</option> 
       <option value=68>68</option> 
       <option value=69>69</option> 

       <option value=70>70</option> 
       <option value=71>71</option> 
       <option value=72>72</option> 
       <option value=73>73</option> 
       <option value=74>74</option> 
       <option value=75>75</option> 
       <option value=76>76</option> 
       <option value=77>77</option> 
       <option value=78>78</option> 
       <option value=79>79</option> 

       <option value=80>80</option> 
       <option value=81>81</option> 
       <option value=82>82</option> 
       <option value=83>83</option> 
       <option value=84>84</option> 
       <option value=85>85</option> 
       <option value=86>86</option> 
       <option value=87>87</option> 
       <option value=88>88</option> 
       <option value=89>89</option> 

       <option value=90>90</option> 
       <option value=91>91</option> 
       <option value=92>92</option> 
       <option value=93>93</option> 
       <option value=94>94</option> 
       <option value=95>95</option> 
       <option value=96>96</option> 
       <option value=97>97</option> 
       <option value=98>98</option> 
       <option value=99>99</option> 
</select></td> 
</tr> 
</table> 
<br><br> 
<table border=0> 

<tr><td valign=top> 
<font face=calibri color=#009933><h3>1) From where did you hear about Angrybullet2 ?</h3></font> 
<font face=calibri color=black><input type=radio name=hear-about value=Search_engines> Search engines (google, yahoo, bing, &#8230)<br> 
<input type=radio name=hear-about value=Fromafriend> From a friend<br> 
<input type=radio name=hear-about value=FromYouTube> From YouTube<br> 
<input type=radio name=hear-about value=Other> Other</font> 

<br><br> 

<font face=calibri color=#009933><h3>2) Are you subscribed to Angrybullet2 ?</h3></font> 
<font face=calibri color=black> 
    <input type=radio name=sub-or-not value=Yes> Yes, I am<br> 
    <input type=radio name=sub-or-not value=No,but_I_wish_to_subscribe> No, but I wish to subscribe<br> 
    <input type=radio name=sub-or-not value=No,I_am_not,and_I_won't_subscribe> No, I am not, and I won't subscribe<br> 
    <input type=radio name=sub-or-not value=No_account> I don't have a YouTube account</font> 

<br><br> 

<font face=calibri color=#009933><h3>3) How many videos of Angrybullet2 did you watch ?</h3></font> 
<font face=calibri color=black><input type=radio name=n videos watched value=None> None<br> 
            <input type=radio name=n-vids-watched value=1-2> 1-2<br> 
            <input type=radio name=n-vids-watched value=3-4> 3-4<br> 
            <input type=radio name=n-vids-watched value=5-9> 5-9<br> 
            <input type=radio name=n-vids-watched value=10_and_more> 10 and more</font> 

<br><br> 

<font face=calibri color=#009933><h3>4) Did you enjoy watching videos from Angrybullet2 ?</h3></font> 
<font face=calibri color=black> 
        <input type=radio name=enjoy-or-not value=Yes,I_did> Yes, I did<br> 
        <input type=radio name=enjoy-or-not value=No,I_didn't> No, I didn't<br> 
        <input type=radio name=enjoy-or-not value=I_watched_none_of_your_videos> I watched none of your videos</font> 

<br><br> 

<font face=calibri color=#009933><h3>5) What was the type of the video(s) you watched ?</h3>Do not answer if you watched none of my videos</font><br> 
<font face=calibri color=black> 
        <input type=checkbox name=vid-type[] value=Tutorial(s)> Tutorial(s) (how to)<br> 
        <input type=checkbox name=vid-type[] value=Sound effect(s)> Sound effect(s)<br> 
        <input type=checkbox name=vid-type[] value=Experiment(s)> Experiment(s)<br> 

<br><br> 

<font face=calibri color=#009933><h3>6) Do you have any suggestion in order to make Angrybullet2 better ?</h3></font> 
    <textarea rows="10" cols="75" name="suggestions"></textarea></td></tr></table> 

<table border=0><tr><td valign=top> 
<input onClick="return ValidateAll()" type="submit" value="Submit survey" class=button></td><td><input type="reset" value="Reset survey fields" class=button></td></tr></table> 
</td></tr></Table> 
</form> 
</div> 
</html> 

任何幫助將不勝感激。在此先感謝您的幫助,併爲您的時間

回答

0

只需從您的代碼中刪除onBlur="CheckName(document.dForm.name.value)"。驗證將在您提交頁面時啓動。