es131245 Posted September 6, 2010 Share Posted September 6, 2010 <html><head><script type="text/javascript" src="functions.js" /></script><!-- CONTENT OF THE "FUNCTION.JS FILEfunction login(){if(document.getElementById('login').value=='login'||document.getElementById('password').value=='password') {document.getElementById('login').style.color='red'; document.getElementById('login').style.textDecoration='blink'; setTimeout(function() {document.getElementById('login').style.color='black'; document.getElementById('login').style.textDecoration='none'; },3000); return false; }}--></head><body><form id="LoginForm" name="LoginForm" action="" method="post" onsubmit="window.login()"><img src="/source/add.png" onclick="window.location.href=window.location.pathname+'?act=login';" /><input type="text" id="login" name="login" value="login" onmouseover="if(this.value=='login'){this.value='';}this.focus();" onmouseout="if(this.value==''){this.value='login';}" /><br /><img src="/source/accept.png" onclick="document.LoginForm.elements[2].click();" /><input type="password" id="password" name="password" value="password" onmouseover="if(this.value=='password'){this.value='';}this.focus();" onmouseout="if(this.value==''){this.value='password';}" /><br /><input type="submit" id="submit" style="display:none;" /></form></body></html> QUESTION:<img onclick="document.LoginForm.submit();return false;" /> is a bad idea because it prevents form onsubmit codeso ive used <img onclick="document.LoginForm.elements[2].click();" /><input type="submit" value="submit" style="display:none;" />BUT now onsubmit cant use "login()"!!!!!so ive found that it works with "window.login()"BUT now i cant stop submitting form by "return false;"AND "window.stop();" abort() exit() doent help too!!!ANY suggestions???? Link to comment Share on other sites More sharing options...
HungryMind Posted September 6, 2010 Share Posted September 6, 2010 Hi!Try This Method:I Just Add 2 Lines...1: <input type="image" src="images/submit.gif" height="30" width="200" border="0" alt="Submit Form">Use Image As Submit Button.2: <form id="LoginForm" name="LoginForm" action="login.php" method="post" onsubmit="return login();">Use login.php in form action.If You Want Any Other Function To Any Image Or Button ClickJust Use This Command onclick="function2();" or onmouseover="function3();" etc etc etc...Hope U Understand. <html><head><script type="text/javascript" src="functions.js" /></script><script type="text/javascript" />function login(){ if(document.getElementById('login').value=='login' || document.getElementById('password').value=='password') { document.getElementById('login').style.color='red'; document.getElementById('login').style.textDecoration='blink'; setTimeout(function(){document.getElementById('login').style.color='black';document.getElementById('login').style.textDecoration='none';},3000); return false; }}</script></head><body><form id="LoginForm" name="LoginForm" action="login.php" method="post" onsubmit="return login();"> <img src="/source/add.png" onclick="window.location.href=window.location.pathname+'?act=login';" /> <input type="text" id="login" name="login" value="login" onmouseover="if(this.value=='login'){this.value='';}this.focus();" onmouseout="if(this.value==''){this.value='login';}" /><br /> <img src="/source/accept.png" onclick="document.LoginForm.elements[2].click();" /> <input type="password" id="password" name="password" value="password" onmouseover="if(this.value=='password'){this.value='';}this.focus();" onmouseout="if(this.value==''){this.value='password';}" /><br /> <input type="image" src="images/submit.gif" height="30" width="200" border="0" alt="Submit Form"> <input type="submit" id="submit" style="display:none;" /></form></body></html> Link to comment Share on other sites More sharing options...
es131245 Posted September 6, 2010 Author Share Posted September 6, 2010 Done it background-color:transparent; make it same a pic but function still doent stop submiting !return false; doent stops firefox from submiting a form Link to comment Share on other sites More sharing options...
es131245 Posted September 6, 2010 Author Share Posted September 6, 2010 only way that works isfunction login(){if(....) //login is bad || passowrd is bad{ document.getElementById('login').style.color='red';' document.getElementById('login').value='login' ;}<form ...... onsubmit="if(document.getElementById('login').value=='login'){return false;} "><input type="image" src="...." onclick="login()" />ORWORK with YOUR CODE BUTform onsubmit="return window.login();"> Link to comment Share on other sites More sharing options...
dsonesuk Posted September 6, 2010 Share Posted September 6, 2010 Not exactly sure what you are trying to achieve, might have it totally wrong, but it it similar to this <script type="text/javascript">/*<![CDATA[*//*---->*/function login(){login_input = document.getElementById('login');pass_input = document.getElementById('password');if(login_input.value=='login' || pass_input.value=='password'){//alert("boomshaka")login_input.style.color='red';login_input.style.textDecoration='blink';setTimeout(function(){login_input.style.color='black';login_input.style.textDecoration='none';},3000);return false;}else{document.getElementById('LoginForm').submit();}}window.onload=function(){login_input = document.getElementById('login');pass_input = document.getElementById('password');login_input.onmouseover = function() { if(this.value=='login') { this.value=''; } this.focus(); }login_input.onmouseout = function() { if(this.value=='') { this.value='login'; } }pass_input.onmouseover= function() { if(this.value=='password') { this.value=''; } this.focus(); } pass_input.onmouseout= function() { if(this.value=='') { this.value='password'; } } document.getElementById('add').onclick=function(){window.location.href=window.location.pathname+'?act=login';}document.getElementById('accept').onclick=function(){login();}}/*--*//*]]>*/</script><style type="text/css">/*img {width:200px; height:25px; background-color:#00CCFF; display:block;}*/</style></head><body><form id="LoginForm" name="LoginForm" action="" method="post" onsubmit="login()"><img id="add" src="/source/add.png" /><input type="text" id="login" name="login" value="login" /><br /><img id="accept" src="/source/accept.png" /><input type="password" id="password" name="password" value="password" /><br /><input type="submit" id="submit" style="visibility:hidden;" /></form></body></html> Link to comment Share on other sites More sharing options...
es131245 Posted September 7, 2010 Author Share Posted September 7, 2010 wowpass_input.onmouseover= function()is a good method to keep html and js separatedmoreover it worked perfect!Thank you... Link to comment Share on other sites More sharing options...
es131245 Posted September 8, 2010 Author Share Posted September 8, 2010 ive got a question about seperating js and html<script type="text/javascript" src="script.js" /></script> window.onload=function(){ var stamp=new Date(document.getElementById('date').innerHTML); function clock() {stamp.setSeconds(stamp.getSeconds()+1); document.getElementById('date').innerHTML=stamp.getDate()+'/'+stamp.getMonth()+'/'+stamp.getFullYear(); document.getElementById('time').innerHTML=stamp.getHours()+':'+stamp.getMinutes()+':'+stamp.getSeconds(); setTimeout('clock();',1000); } clock(); document.getElementById('login').onmouseover=function(){if(this.value=='login'){this.value='';}this.focus();} document.getElementById('login').onmouseout=function(){if(this.value==''){this.value='login';}this.blur();} document.getElementById('password').onmouseover=function(){if(this.value=='password'){this.value='';}this.focus();} document.getElementById('password').onmouseout=function(){if(this.value==''){this.value='password';}this.blur();} document.getElementById('registrate').onclick=function(){window.location.href=window.location.pathname+'?act=login';} document.LoginForm.onsubmit=function(){if(document.getElementById('login').value==''||document.getElementById('login').value=='login'||document.getElementById('password').value=='') {document.getElementById('login').style.color='red'; document.getElementById('login').style.textDecoration='blink'; document.getElementById('password').style.color='red'; document.getElementById('password').style.textDecoration='blink'; setTimeout(function() {document.getElementById('login').style.color='black'; document.getElementById('login').style.textDecoration='none'; document.getElementById('password').style.color='black'; document.getElementById('password').style.textDecoration='none'; },3000); return false; } }} but function in a function doent work...ff says>>>> clock();clock is not definedbut in html it worked well Link to comment Share on other sites More sharing options...
dsonesuk Posted September 8, 2010 Share Posted September 8, 2010 that's because the functions are only run once within the onload function, and are not global and therefore cannot be accessed from outside the onload function.clock(); can be placed inside onload, as you need these elements with id date, time to be rendered before running this function.var stamp=new Date(document.getElementById('date').innerHTML); needs to only run when called through function. <script type="text/javascript">/*<![CDATA[*//*---->*/function clock(){var stamp=new Date(document.getElementById('date').innerHTML);stamp.setSeconds(stamp.getSeconds()+1); document.getElementById('date').innerHTML=stamp.getDate()+'/'+stamp.getMonth()+'/'+stamp.getFullYear(); document.getElementById('time').innerHTML=stamp.getHours()+':'+stamp.getMinutes()+':'+stamp.getSeconds(); setTimeout('clock();',1000);}window.onload=function(){clock();...rest of code}/*--*//*]]>*/</script> Link to comment Share on other sites More sharing options...
justsomeguy Posted September 8, 2010 Share Posted September 8, 2010 You can also explicitly define it in the window scope, and then it will be available for setTimeout to use: window.clock = function(){ stamp.setSeconds(stamp.getSeconds()+1); document.getElementById('date').innerHTML=stamp.getDate()+'/'+stamp.getMonth()+'/'+stamp.getFullYear(); document.getElementById('time').innerHTML=stamp.getHours()+':'+stamp.getMinutes()+':'+stamp.getSeconds(); setTimeout('clock();',1000);}clock(); You can also pass setTimeout a reference to the function instead of the name in quotes: function clock(){stamp.setSeconds(stamp.getSeconds()+1); document.getElementById('date').innerHTML=stamp.getDate()+'/'+stamp.getMonth()+'/'+stamp.getFullYear(); document.getElementById('time').innerHTML=stamp.getHours()+':'+stamp.getMinutes()+':'+stamp.getSeconds(); setTimeout(clock, 1000);}clock(); Link to comment Share on other sites More sharing options...
es131245 Posted September 9, 2010 Author Share Posted September 9, 2010 its a bit different here...because I'm using server time on my page so its like.... <sub id="date"><?php print(date('F j,Y H:i:s'));?></sub><sub id="time"></sub> function clock(){stamp.setSeconds(stamp.getSeconds()+1); document.getElementById('date').innerHTML=stamp.getDate()+'/'+stamp.getMonth()+'/'+stamp.getFullYear(); document.getElementById('time').innerHTML=stamp.getHours()+':'+stamp.getMinutes()+':'+stamp.getSeconds(); setTimeout('clock(stamp);',1000);}window.onload=function(){clock(stamp=new Date(document.getElementById('date').innerHTML));} Link to comment Share on other sites More sharing options...
justsomeguy Posted September 9, 2010 Share Posted September 9, 2010 It's still the same. Your function doesn't take any parameters, it's using a global variable. Link to comment Share on other sites More sharing options...
es131245 Posted September 10, 2010 Author Share Posted September 10, 2010 how do i coorectly usewindow.onload+=without any str replace functions?? Link to comment Share on other sites More sharing options...
justsomeguy Posted September 10, 2010 Share Posted September 10, 2010 You don't use += with functions, that is a string operator. window.onload is not a string, it's a function.old_onload = window.onload;window.onload = function(){ old_onload(); // others} Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.