|
JavaScript - Onblur Doesnt Work In Ie6, Ie7
I have a problem with one simple script, which works in every browser, just not in IE6 and IE7. You can see the script at http://bbtalk.eu/iframe.html - when you click on the iframe, you should see "clicked at the bottom". But it doesnt work in IE6 and IE7. Do anyone know how to fix that? Thank you
Similar TutorialsCan anyone please tell me what im doing wrong? Code:
<script type = "text/javascript">
function submitallforms() {
setTimeout('document.forms[0].submit()',100);
setTimeout('document.forms[1].submit()',200);
setTimeout('document.forms[2].submit()',300);
}
</script>
<NOSCRIPT>This shopping-cart needs JavaScript. Please enable JavaScript in your browser's preferences.</NOSCRIPT>
<script> if(typeof navigator.cookieEnabled=="boolean" && !navigator.cookieEnabled) alert("You need to enable Cookies in your browser, before this shopping-cart will work for you!"); </script>
<!-- <script src=noper-language-pdt.utf8.js></script> -->
<script src=http://www.mlpdecals.com/cgi/nopercart.js></script>
<FORM name="0" action="shoppingcart.htm" method=GET onSubmit="return AddToCart(this)">
<font class=bigtext><b>Special Instructions:</b></font><br>
<input type=text size=32 maxlength=200 name=USERTEXT>
<input type=hidden _PRICE="0.00" _QUANTITY="1" _NAME="special-instructions" _ID="nSPCI">
</FORM>
<br><br>
<FORM name="0" action="shoppingcart.htm" method=GET onSubmit="return AddToCart(this)">
<font class=bigtext><b>Special Instructions:</b></font><br>
<input type=text size=32 maxlength=200 name=USERTEXT>
<input type=hidden _PRICE="0.00" _QUANTITY="1" _NAME="special-instructions" _ID="nSPCI">
</FORM>
<br>
<br>
<input type=submit value="Submit" onclick="submitallforms();">
Im new to javascript and trying to make a form validator, ive succeeded but its left me confussed as to setting variables. my original code was Code: function applyform()
{
var name = document.getElementById('mainname');
var lvl = document.getElementById('mainlvl');
var class = document.getElementById('mainclass');
var role = document.getElementById('mainrole');
var reason = document.getElementById('reason');
var age = document.getElementById('age');
var mic = document.getElementById('microphone');
var voice = document.getElementById('voice');
if(notempty(name, "Please enter your main characters name")){
if(dropselect(lvl, "Please select your characters level")){
if(dropselect(class, "Please select your characters class")){
if(dropselect(role, "Please select your characters role")){
if(notempty(reason, "Please tell us why you wish to join us")){
if(notempty(age, "Please state your age")){
if(notempty(mic, "Please state if you have a microphone")){
if(notempty(voice, "Please state if you will use voice communication during events")){
return true;
}
}
}
}
}
}
}
}
return false;
}
using this stoped all my javascript functions working but i cant see any fault with it. I've changed the code now to Code: function applyform()
{
if(notempty(document.getElementById('mainname'), "Please enter your main characters name")){
if(dropselect(document.getElementById('mainlvl'), "Please select your characters level")){
if(dropselect(document.getElementById('mainclass'), "Please select your characters class")){
if(dropselect(document.getElementById('mainrole'), "Please select your characters role")){
if(notempty(document.getElementById('reason'), "Please tell us why you wish to join us")){
if(notempty(document.getElementById('age'), "Please state your age")){
if(notempty(document.getElementById('microphone'), "Please state if you have a microphone")){
if(notempty(document.getElementById('voice'), "Please state if you will use voice communication during events")){
return true;
}
}
}
}
}
}
}
}
return false;
}
this works fine but i don't get why my first bit of code didnt work and id really appreciate someone explaining it to me. thanks in advance Hey guys I have a stupid problem, my teacher asked us to DONT use javadscript in html (like onchange ="....") If i use following js in html my page works: <select id="car" name="car" onchange="configurator()"> If i delete that last piece and try to code it in a .js file like: document.getElementsById("car").onchange = configurator; it doesnt work, it doest recognize the .onchange method Thanks in advance <html> <script language="javascript"> function checkForm() { String name= document.getElementById("name"); if(name.length==0) return ; // else // return ; } </script> <body> <form action="test2.jsp" onclick =" return checkForm()"> <input type="text" name="name" value="shyam" id="name" /> <input type="submit" name="sub" value="clickme" /> </form> </body> </html> I use a basic pop-up window code that i have used for many years. I probably need to update it, but i was wondering why it will work for every browser but IE8. Can anyone help? Code: function popUp(URL) {
day = new Date();
id = day.getTime();
eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=0,location=0,statusbar=1,menubar=0,resizable=0,width=600,height=400,left = 540,top = 325');");
}
Code: <a href="javascript:popUp('/email/agent/aid/<?php echo $this->agent->pers_code?>')" >
can anyone see something that may cause the problem? Thanks for any help! Trying to have my navigation have an on click and selected state, but I am not able to do so with this code (website is: http://bit.ly/rgwsite ) Code: $('nav li a').click(function() {
$(this).parent().addClass('on').siblings().removeClass('on');
});
nav li is as follows Code: <nav>
<li class="highlt">
<a href="index.php" class="home"><span>Home</span></a>
</li>
The reason we need to use a jquery/javascript action to add the class to the navigation is because it doesn't refresh when a new page loads. For instance, when you're on the home page and click on the tab "Experience RGW", it only loads the content for that page below the header (within the "#ajax" div). Currently, none of these scripts are working. There is no reason they shouldn't... could there be something else causing the page not to recognize the jquery script and run it on-click? The main reason I ask is because I've tried to test the function and add an alert, but even that didn't work Hi All, Im trying to add some content by JS (which ive done) but i cant click a link i have made; JS: Code: function game() {
document.getElementById('title').innerHTML = '<p style="float: left; text-decoration: underline; font-weight: bold;">Deady Teddy</p><img src=css/images/popup/close.png style="float: right; cursor: hand;" href="javascript: hideModal("modalPage");"></img>';
}
*Yes i know about the Href but if i put "onClick" it gives errors*; HTML: Code: <a href="javascript:void(0);" onClick="javascript: revealModal('modalPage'); game();">Deady Teddy </a>
And place its adding it to: Code: <div id="modalPage"> <div class="modalBackground"></div> <div class="modalContainer"> <div class="modal"> <div class="modalTop" id="title" onselectstart='return false'> </div></div></div></div> Any Idea's? function hasTagsInText(text) { if(text.indexOf("<TABLE") >=0 || text.indexOf("<table") >=0) return 'table'; ///this line of code doesnt work in firefox Hello here is my code that im dealing with and only second sliceshow works for me i need them both that would be working together please help me! thanks for any help here is my script <head> <title>Easy Slider jQuery Plugin Demo</title> <meta http-equiv="content-type" content="text/html;charset=UTF-8" /> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/easySlider1.7.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#slider").easySlider({ auto: true, continuous: true, nextId: "slider1next", prevId: "slider1prev" }); }); </script> <link href="css/screen.css" rel="stylesheet" type="text/css" media="screen" /> <link rel="stylesheet" type="text/css" href="leidyba/css/demo.css" /> <link rel="stylesheet" type="text/css" href="leidyba/css/styleleidyba.css" /> <link rel="stylesheet" type="text/css" href="leidyba/css/jquery.jscrollpane.css" media="all" /> <link href='http://fonts.googleapis.com/css?family=PT+Sans+Narrow&v1' rel='stylesheet' type='text/css' /> <link href='http://fonts.googleapis.com/css?family=Coustard:900' rel='stylesheet' type='text/css' /> <link href='http://fonts.googleapis.com/css?family=Rochester' rel='stylesheet' type='text/css' /> <div id="container"> <div id="header"> <h1>Easy Slider jQuery Plugin - Multiple sliders</h1> </div> <div id="content"> <div id="slider"> <ul> <li><a href="http://templatica.com/preview/30"><img src="slide/images/01.jpg" alt="Css Template Preview" /></a></li> <li><a href="http://templatica.com/preview/7"><img src="slide/images/02.jpg" alt="Css Template Preview" /></a></li> <li><a href="http://templatica.com/preview/25"><img src="slide/images/03.jpg" alt="Css Template Preview" /></a></li> </ul> </div> <div class="container"> <div id="ca-container" class="ca-container"> <div class="ca-wrapper"> <div class="ca-item ca-item-1"> <div class="ca-item-main"> <div class="ca-icon"></div> <h3>Knygų leidyba</h3> <h4> <span class="ca-quote">“</span> <span>The greatness of a nation and its moral progress can be judged by the way in which its animals are treated.</span> </h4> <a href="#" class="ca-more">plačiau...</a> </div> <div class="ca-content-wrapper"> <div class="ca-content"> <h6>Knygų leidyba</h6> <a href="#" class="ca-close">close</a> <div class="ca-content-text"> <p>I am so happy, my </p> <p>When, while the </p> <p>She packed her .</p> </div> <ul> <li><a href="#">Read more</a></li> <li><a href="#">Share this</a></li> <li><a href="#">Become a member</a></li> <li><a href="#">Donate</a></li> </ul> </div> </div> </div> <div class="ca-item ca-item-2"> <div class="ca-item-main"> <div class="ca-icon"></div> <h3>Reklaminiai bukletai</h3> <h4> <span class="ca-quote">“</span> <span>I hold that the more </span> </h4> <a href="#" class="ca-more">plačiau...</a> </div> <div class="ca-content-wrapper"> <div class="ca-content"> <h6>Would you eat your dog?</h6> <a href="#" class="ca-close">close</a> <div class="ca-content-text"> <p>I am so happy, my .</p> <p>When, while the </p> <p>She packed her </p> </div> <ul> <li><a href="#">Read more</a></li> <li><a href="#">Share this</a></li> <li><a href="#">Become a member</a></li> <li><a href="#">Donate</a></li> </ul> </div> </div> </div> </div> </div> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> <script type="text/javascript" src="leidyba/js/jquery.easing.1.3.js"></script> <!-- the jScrollPane script --> <script type="text/javascript" src="leidyba/js/jquery.mousewheel.js"></script> <script type="text/javascript" src="leidyba/js/jquery.contentcarousel.js"></script> <script type="text/javascript"> $('#ca-container').contentcarousel({ }); </script> </div> </body> </html> this is my code ______________________________________________________________ <pega:when test="$mode-input"> <script language="JavaScript"> function showNextButton() { handleClientEvent('SERVER','MakeScoreOrder','','-1'); /* fetches the data */ var submitClicked = "<p:r n='pyWorkPage.PFRSData.SubmitClicked' />"; var submitClicked = submitClicked.replace(/^\s\s*/, '').replace(/\s\s*$/, ''); var msg = "<p:r n='pyWorkPage.PFRSData.HasMessages' />"; var msg = msg.replace(/^\s\s*/, '').replace(/\s\s*$/, ''); if (submitClicked == "" || msg =="true") { toggleSubmitBtn(0); } else if (submitClicked == "true" || msg =="false") { toggleSubmitBtn(1); } } function toggleSubmitBtn(status) { var submitButton=document.actionForm.submitButton; if(submitButton) { var parentTable=pega.u.d.findParentTable(submitButton); if(parentTable) if(status) { if(parentTable.style.display=='none' || parentTable.style.display=='') { parentTable.style.display='inline'; document.actionForm.submitButton.disabled=false; } } else { parentTable.style.display='none'; document.actionForm.submitButton.disabled=true; } } } </script> <button onClick="showNextButton();" id="PISSubmit" style="vertical-align:middle;"> <span class='buttonLeft'></span> <span class='buttonMiddle'> <span class='buttonText' onmouseover="this.className='buttonTextHover'" onmouseout="this.className='buttonText'">Submit</span> </span> <span class='buttonRight'></span> </button> </pega:when> ___________________________________________________________ On clicking PISsubmit button it should fetch data and display the next button(submitButton).. but on first click nothing happens on second click it fetches the data and third click it displays Next(submitButton)button. Kindly help !! Note: its in pega application. There is a Js file i am including in my application that has a below function Code: function highlightInputs() {
var inputs = document.getElementsByTagName('input');
var i;
for (i=0; i<inputs.length; i++) {
inputs[i].onfocus = function() {
this.style.background = '#F6F6F6';
}
inputs[i].onblur = function() {
this.style.background = '#FFF';
}
}
}
addEvent (window, "load", highlightInputs);
Code: <INPUT TYPE="text" NAME="InvoiceDate_DT" id="InvoiceDate_DT" value="<?=($InvoiceDate_DT)?>" class="smtxtbox" onBlur="javascript:alert('test');">
Now in the same page, i have a textbox and i try to fire an onblur() event which is not getting fired. Onclick() works but onblur() doesnt..strange.. When i disable the .js file it gets fired. What is the problem?? Its on all the browsers Thanks Hi, I have dynamic table with the fileds that have input boxes where X is the counter. Finaly I got unique id ABC1,ABC2,ABC3......... <table><tr> <td><input id=ABC<%=X%> value="<%=RS("Name")%>"></td> <td><input id=ABC<%=X%> value="<%=RS("Name")%>"></td> <td><input id=ABC<%=X%> value="<%=RS("Name")%>"></td> <td>...</td><td>...</td><td>...</td></tr></table> How to get value of each row onblur in javascript Thanks a lot, MZ Hi, can someone show me why I cant get the onfocus and onblur to loop thru the function showTextContent() when entering the words one, two, three or four. I have tried for days, googled and lost a lot of hair trying to figure it out. http://www.data-affiliates.com/DL234...5/attempt.html Code: <html>
<!-- Created on: 08.08.2009 -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title></title>
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="author" content="sdfgdfg">
<meta name="generator" content="AceHTML 6 Pro">
<link rel="stylesheet" href="vid61.css" type="text/css" media="screen" />
<script type="text/javascript">
function toggle(id, status){
document.getElementById(id).style.visibility = status;
}
function myFocus(element)
{
if (element.value == element.defaultValue) {
element.value = '';
}
}
function myBlur(element) {
if (element.value == '') {
element.value = element.defaultValue;
}
}
function populateSearchField(){
var specialChars = "\\.+*?[^]$(){}=!<>|:,-=/";
var ignoreList = ["a", "the"];
var i, j, searchFld, keywords;
if (!(searchFld = document.getElementsByName('formcontent')[0])) return;
if (!(keywords = document.referrer.match(/[pq]=(.*?)&/))) return;
var preg_quote = function(str){return (str+'').replace(/([\\\.\+\*\?\[\^\]\$\(\)\{\}\=\!<>\|\:])/g, "\\$1");}
keywords = decodeURIComponent(keywords[1]).replace(new RegExp('[' + preg_quote(specialChars) + ']', 'g'), ' ').split(/[\+ ]/);
for (i = 0; i < keywords.length; i++){
for (j = 0; j < ignoreList.length; j++) if (!keywords[i] || (keywords[i] == ignoreList[j])) {
keywords.splice(i--, 1);
break;
}
}
searchFld.value = keywords.join(' ');
}
function keywordMatch(keywords, text) {
var result = 0;
for (var i in keywords) {
if (text.match(new RegExp("(^| )" + keywords[i] + "( |$)", "i"))) {
result++;
};
}
return result;
}
function showTextContent() {
var i, matches = [];
var div, divcontent, divs = document.getElementById("ts-1").getElementsByTagName('div');
var keywords = document.getElementsByName('formcontent')[0].value.split(' ');
for (i = 0; i < divs.length; i++) {
div = divs[i];
divcontent = div.lastChild.nodeValue;
if (keywordMatch(keywords, divcontent)) {
matches.push(div);
}
}
if (matches[0]) {
document.getElementById('take1000').innerHTML = matches.length + " matches / Treffer";
for (i = 0; i < matches.length; i++) {
matches[i].onmouseover(toggle('take1000', 'visible'));
matches[i].onmouseout = null;
}
}
else {
document.getElementById("ts-1").innerHTML = "" ;
matches[i].onmouseover(toggle('notake1000', 'visible'));
}
}
window.onload = function(){
populateSearchField();
showTextContent();
}
</script>
</head>
<body>
<div id="container">
<div id="notake1000">Keine Ergebnisse / No Matches</div>
<div id="take1000"></div>
<div id="ulent">Search this site / Diese Seite durchsuchen :</div><form><input type="text" name="formcontent" value="one" onmouseover="toggle('notake1000', 'hidden');toggle('take1000', 'hidden');" onfocus="myFocus(this); showTextContent();" onblur="myBlur(this); showTextContent();" style="font-family:Arial;color:#ffff40;text-align:center;font-size:12px;font-weight:bold;float:right;margin-left : auto;margin-right : 2px;border: 2px double #AFAFAF;background-color: #5F5F5F;padding:1px;height:18px;width:293px;" /></form>
<div id="ts-1" style="visibility:hidden;">
<div onmouseover="toggle('fo-test1', 'visible');" onmouseout="this.className='ts-1-1';toggle('fo-test1', 'hidden');" onmouseup="this.className='ts-1-3A';" class="ts-1-1"><object id="fo-test1" style="visibility:hidden;" type="application/x-shockwave-flash" data="peelawayok.swf" width="356" height="286"><param name="movie" value="peelawayok.swf" /><param name="quality" value="high" /><param name="wmode" value="transparent" /><param name="menu" value="false" /></object>www.Ihre-domain.de<br />one</div>
<div onmouseover="toggle('fo-test2', 'visible');" onmouseout="this.className='ts-1-2';toggle('fo-test2', 'hidden');" onmouseup="this.className='ts-1-3A';" class="ts-1-2"><object id="fo-test2" style="visibility:hidden" type="application/x-shockwave-flash" data="peelawayok.swf" width="356" height="286"><param name="movie" value="peelawayok.swf" /><param name="quality" value="high" /><param name="wmode" value="transparent" /><param name="menu" value="false" /></object>www.Ihre-domain.de<br />two</div>
<div onmouseover="toggle('fo-test3', 'visible');" onmouseout="this.className='ts-1-3';toggle('fo-test3', 'hidden');" onmouseup="this.className='ts-1-3A';" class="ts-1-3"><object id="fo-test3" style="visibility:hidden" type="application/x-shockwave-flash" data="peelawayok.swf" width="356" height="286"><param name="movie" value="peelawayok.swf" /><param name="quality" value="high" /><param name="wmode" value="transparent" /><param name="menu" value="false" /></object><br />www.Ihre-domain.de<br />three</div>
<div onmouseover="toggle('fo-test4', 'visible');" onmouseout="this.className='ts-1-4';toggle('fo-test4', 'hidden');" onmouseup="this.className='ts-1-3A';" class="ts-1-4"><object id="fo-test4" style="visibility:hidden" type="application/x-shockwave-flash" data="peelawayok.swf" width="356" height="286"><param name="movie" value="peelawayok.swf" /><param name="quality" value="high" /><param name="wmode" value="transparent" /><param name="menu" value="false" /></object><br />www.Ihre-domain.de<br />four</div>
</div>
</div>
</body>
</html>
okay. clearing a form. I have a clear button. when I push it, I want all the red text boxes and onblur messages to disappear. anyone have an idea on where i can start? heres javascript Code: function isFormValid()
{
var userF = document.getElementById('FName').value;
var userL = document.getElementById('LName').value;
var userPW = document.getElementById('pw').value;
var userPW2 = document.getElementById('pw2').value;
var userBDay = document.getElementById('BDay').value;
var userEmail = document.getElementById('email').value;
var NameFormat = /^[A-Za-z]{2,12}$/;
var PWFormat = /^[A-Za-z0-9]{6,12}$]/;
var BDayFormat = /^(\d{1,2})[\s\.\/-](\d{1,2})[\s\.\/-](\d{4})$/;
var EmailFormat = /^([\w-]{2,})@([A-z\d][-A-z\d]+)\.[A-z]{2,8}/;
var retVal = true;
var errorMsg = "";
if (!NameFormat.test(userF))
{
assignErrorClass("FName");
errorMsg = "First Name is required. 2-12 letters only\n";
retVal = false;
}
if (!NameFormat.test(userL))
{
assignErrorClass("LName");
errorMsg = errorMsg + "Last Name is required. 2-12 letters only\n";
retVal = false;
}
if (!PWFormat.test(userPW))
{
assignErrorClass("pw");
errorMsg = errorMsg + "Password is required. 6-12 letters or numbers only.\n";
retVal = false;
}
if (userPW2 == "")
{
assignErrorClass("pw2");
errorMsg = errorMsg + "Please Retype password.\n";
retVal = false;
}
if ((userPW != userPW2) && (userPW2 !== ""))
{
assignErrorClass("pw2");
errorMsg = errorMsg + "Passwords do not match.\n";
retVal = false;
}
if (userBDay == "")
{
assignErrorClass("BDay");
errorMsg = errorMsg + "Please Enter a Birthday.\n";
retVal = false;
}
if ((!BDayFormat.test(userBDay)) && (userBDay !== ""))
{
assignErrorClass("BDay");
errorMsg = errorMsg + "Incorrect Birthday format\n";
retVal = false;
}
if (badBirthday("BDay") && (userBDay !== "")) {
assignErrorClass("BDay");
retVal = false;
errorMsg = errorMsg + "Invalid Birthday\n";
}
if (userEmail == "")
{
assignErrorClass("email");
errorMsg = errorMsg + "Please Enter an Email address.\n";
retVal = false;
}
if ((!EmailFormat.test(userEmail)) && (userEmail !== ""))
{
assignErrorClass("email");
errorMsg = errorMsg + "Please Enter a valid Email address.\n";
retVal = false;
}
if (!retVal)
{
alert( errorMsg);
}
return retVal;
}
function assignErrorClass(objName)
{
var obj = document.getElementById(objName);
obj.className = "err";
}
function badBirthday( objName) {
var obj = document.getElementById(objName);
var dateStr = obj.value;
var mn = dateStr.split("/")[0];
var dy = dateStr.split("/")[1];
var yr = dateStr.split("/")[2];
var dateObj = new Date(yr,mn-1,dy); //JavaScript and PHP number the months 0 to 11.
if (dateObj.getFullYear() != yr || dateObj.getMonth()+1 != mn || dateObj.getDate() != dy) {
return true;
} else {
return false;
}
}
function checkFName()
{
var userF = document.getElementById('FName').value;
var elementF = document.getElementById('labelFName');
var NameFormat = /^[A-Za-z]{2,12}$/;
if (!NameFormat.test(userF))
{
elementF.innerHTML = "First Name is required. 2-12 letters only";
elementF.style.color = "red";
}
else
{
elementF.innerHTML = "";
elementF.style.color = "green";
}
}
function checkLName()
{
var userL = document.getElementById('LName').value;
var elementL = document.getElementById('labelLName');
var NameFormat = /^[A-Za-z]{2,12}$/;
if (!NameFormat.test(userL))
{
elementL.innerHTML = "Last Name is required. 2-12 letters only";
elementL.style.color = "red";
}
else
{
elementL.innerHTML = "";
elementL.style.color = "green";
}
}
function checkpw()
{
var userPW = document.getElementById('pw').value;
var elementPW = document.getElementById('labelpw');
var PWFormat = /^[A-z0-9]{6,12}$/;
if (!PWFormat.test(userPW))
{
elementPW.innerHTML = "Password is required. 6-12 letters or numbers only.";
elementPW.style.color = "red";
}
else
{
elementPW.innerHTML = "Good Password";
elementPW.style.color = "green";
}
}
function checkpw2()
{
var userPW2 = document.getElementById('pw2').value;
var userPW = document.getElementById('pw').value;
var elementPW2 = document.getElementById('labelpw2');
if ((userPW != userPW2) && (userPW2 !== ""))
{
elementPW2.innerHTML = "Passwords do not match.";
elementPW2.style.color = "red";
}
else if (userPW2 == "")
{
elementPW2.innerHTML = "Please Retype password.";
elementPW2.style.color = "red";
}
else
{
elementPW2.innerHTML = "Passwords Match";
elementPW2.style.color = "green";
}
}
function checkBDay()
{
var userBDay = document.getElementById('BDay').value;
var elementBDay = document.getElementById('labelBDay');
var BDayFormat = /^(\d{1,2})[\s\.\/-](\d{1,2})[\s\.\/-](\d{4})$/;
if (userBDay == "")
{
elementBDay.innerHTML = "Please enter A Birthday.";
elementBDay.style.color = "red";
}
else if ((!BDayFormat.test(userBDay)) && (userBDay !== ""))
{
elementBDay.innerHTML = "Please enter mm/dd/yyyy format.";
elementBDay.style.color = "red";
}
else if ((badBirthday("BDay")) && (userBDay !== ""))
{
elementBDay.innerHTML = "Please enter valid Birthday.";
elementBDay.style.color = "red";
}
else
{
elementBDay.innerHTML = "";
elementBDay.style.color = "green";
}
}
function checkEmail()
{
var userEmail = document.getElementById('email').value;
var elementEmail = document.getElementById('labelEmail');
var EmailFormat = /^([\w-]{2,})@([A-z\d][-A-z\d]+)\.[A-z]{2,8}/;
if ((!EmailFormat.test(userEmail)) && (userEmail !== ""))
{
elementEmail.innerHTML = "Please enter a Valid Email address.";
elementEmail.style.color = "red";
}
else if (userEmail == "")
{
elementEmail.innerHTML = "Please enter an Email address.";
elementEmail.style.color = "red";
}
else
{
elementEmail.innerHTML = "";
elementEmail.style.color = "green";
}
}
heres the html Code: <form action="mailto:hummdedum@felloff.com" method="post" name="form" onSubmit="return isFormValid();">
* First Name: <input type="text" name="FName" id="FName" onblur="checkFName();"/><label id="labelFName"></label><br />
* Last Name: <input type="text" name="LName" id="LName"onblur="checkLName();"/><label id="labelLName"></label><br />
* Password: <input type="password" id="pw" name="Password" onblur="checkpw();"/><label id="labelpw"></label><br />
*Re-type Password: <input type="password" name="2Password" id="pw2" onblur="checkpw2();" /><label id="labelpw2"></label><br />
I am a: <br />
<input type="radio" name="status" value="fresh" /> Freshman<br />
<input type="radio" name="status" value="soph" /> Sophomore<br />
<input type="radio" name="status" value="jr" /> Junior<br />
<input type="radio" name="status" value="sr" /> Senior<br />
I am taking classes in the: <br />
<input type="checkbox" name="semester" value="fall" /> fall time<br />
<input type="checkbox" name="semester" value="spring" /> Spring time <br />
My favorite element is:
<select name="element" id="element">
<option value="">select</option>
<option value="fire">Fire</option>
<option value="earth">Earth</option>
<option value="water">Water</option>
<option value="air">Air</option>
</select><br />
*Birthday: mm/dd/yyyy<input type="text" id="BDay" name="Birthday" onblur="checkBDay();"/><label id="labelBDay"></label><br />
*E-Mail: <input type="text" id="email" name="Email" onblur="checkEmail();"/><label id="labelEmail"></label><br />
<input type="submit" value="Submit" />
<input type="reset" value="Clear" />
</form>
css i guess would be Code: .err {
border: 2px solid #FF0000;}
#errMsg {
font-size: 110%;
color: #FF0000;}
super thanks!!!!!! -pumpkin I am trying to make an onblur that calls a function and passes it some text, for example: onblur = "function("Hello")" however this wont work as it is not even calling the function. I have tried all the different encapsulation tags I can think of but still no luck is there any way of doing it or can I assign the text to a variable and call the function in the onblur? Thanks.:confused: greetings, i have a function that sets the onfocus and onblur event for every item in a table which then tells it to the change the class name. for some reason this doesn't seem to be working with the <select> inputs. i have heard it has something to do with how the option list re-loads itself??? Code: function setTableActivation(){
tableDiv = document.getElementById("tables");
tables = tableDiv.getElementsByTagName("table");
count = tables.length;
for(var h=0;h<count;h++){
var table = tables[h];
table.accessKey = h;
table.onfocus = function(){tables[this.accessKey].className = "activeTable";};
table.onblur = function(){tables[this.accessKey].className = "searchreal";};
for(var i=0;i<table.rows.length;i++){
row = table.rows[i];
row.accessKey = h;
row.onfocus = function(){tables[this.accessKey].className = "activeTable";};
row.onblur = function(){tables[this.accessKey].className = "searchreal";};
for(var j=0;j<table.rows[i].cells.length;j++){
cell = table.rows[i].cells[j];
cell.accessKey = h;
cell.onfocus = function(){tables[this.accessKey].className = "activeTable";};
cell.onblur = function(){tables[this.accessKey].className = "searchreal";};
for (var k = 0; k < cell.childNodes.length; k++) {
if (cell.childNodes[k].nodeType == document.ELEMENT_NODE) {
cell.childNodes[k].accessKey = h;
cell.childNodes[k].onfocus = function(){tables[this.accessKey].className = "activeTable";};
cell.childNodes[k].onblur = function(){tables[this.accessKey].className = "searchreal";};
if(cell.childNodes[k].tagName == "SELECT"){
}
}
}
}
}
}
}
Hi, I'm a little rusty on my javascript. I'm trying to use onKeyUp and onBlur to validate html table field text entry. I'm using Firefox in Windows XP, and Javascript is turned on. Mind taking a look to see why it's not working? Thanks! -Jason Code: <html>
<head>
<title>javascript onKeyUp problem example</title>
<script type="text/javascript"><!--
//Validates full zip code when zip code field is left. If invalid, should pop an alert message.
function onBlur_Zip() {
var zipCodePattern = /^\d{5}$|^\d{5}-\d{4}$/;
if (zipCodePattern.test(document.getElementByID("zip").value) == -1) {
alert("Please enter a valid zip code.");
}
return false;
}
//Validates partial zip code. If invalid, should make table row background color yellow.
function onKeyPress_Zip() {
var zipCodePattern = /^\d{0,5}$|^\d{5}-\d{0,4}$/;
var val = document.getElementByID("zip").value;
alert(val);
if (zipCodePattern.test(document.getElementByID("zip").value) == -1) {
alert("onkeypress zip false");
document.getElementByID("zipRow").style.backgroundColor="yellow";
}
else {
alert("onkeypress zip true");
document.getElementByID("zipRow").style.backgroundColor="white";
}
return false;
}
// -->
</script>
</head>
<body>
<form><table border=1 cellpadding=5>
<tr id="zipRow">
<td>Test field:</td>
<td><input id="zip" type="text" name="zip" onKeyUp="javascript:onKeyPress_Zip()" onBlur="javascript:onBlur_Zip()" /></td>
</tr></table></form>
</body>
</html>
Hi all, I am working on a site which is in a frameset. There is content area, a footer and a workqueue on the right. Now what I do is poll the workqueue every 30 seconds, check if there are any changes to any queues and if so, I make them go bold and red and play a beep. That's no problem, that works fine. The trouble is I am trying to make the title flash "New Item" if the window is out of focus (Minimised would be better but dont think that is possible to detect). The flashing bit is no problem, it's the triggering when the windows out of focus that is a problem. Applying events to the window object doesn't work. The closest I have come to making it work is this, but it doesn't work in firefox... Code: var debugwin = window.open("", "newwin", "width=300, height=300, scrollbars=1");
debugwin.document.open();
debugwin.document.write("<HTML><TITLE>Debug Window</TITLE><BODY>");
debugwin.document.write("</BODY></HTML>");
debugwin.document.close();
function addDebug(msg) {
debugwin.document.body.innerHTML = msg + "<BR/>" + debugwin.document.body.innerHTML;
}
<!--<frameset onblur="workitemAlerts.setItemAlerts(false);" onfocus="workitemAlerts.setItemAlerts(true);" id="titleframeset" rows="<%= HEADER_FRAME_RESTORED %>,*,<%= FOOTER_FRAME_HEIGHT %>" framespacing="0" border="0" frameborder="0">-->
<frameset onblur="addDebug('Blur 1st frameset');" onfocus="addDebug('Focus 1st frameset');" id="titleframeset" rows="<%= HEADER_FRAME_RESTORED %>,*,<%= FOOTER_FRAME_HEIGHT %>" framespacing="0" border="0" frameborder="0">
<frame onblur="addDebug('Blur frame 1');" onfocus="addDebug('Focus frame 1');" noresize scrolling="no" framespacing="0" border="0" frameborder="0" id="titlebar" name="titlebar" src="<wfmt:headerpage />">
<frameset onblur="addDebug('Blur 2nd frameset');" onfocus="addDebug('Focus 2nd frameset');" id="mainframeset" cols="10,*,<%= MAIN_FRAME_RESTORED %>" framespacing="0" border="0" frameborder="0">
<frame onblur="addDebug('Blur frame 2');" onfocus="addDebug('Focus frame 2');" noresize framespacing="0" border="0" frameborder="0" name="leftpad" src="mainColourFill.jsp" scrolling="no">
<frame onblur="addDebug('Blur frame 3');" onfocus="addDebug('Focus frame 3');" noresize name="windmain" src="<wfmt:postloginpage />" scrolling="auto">
<frame onblur="addDebug('Blur frame 4');" onfocus="addDebug('Focus frame 4');" noresize framespacing="0" border="0" frameborder="0" name="queues" src="workqueues.jsp" scrolling="no" style="BORDER-RIGHT: gray 1pt solid;">
</frameset>
<frame noresize scrolling="no" framespacing="0" border="0" frameborder="0" name="footerbar" src="footer.jsp">
</frameset>
I have popped up a little window to help me view debug away from the window so I can focus and blur and still see the output to see what events are triggering. IE seems to trigger the events on the <frame> tags fine, which means I can achieve what I need to in IE, however FF isn't playing ball. Anybody know what I can do to detect if the window is out of focus. TIA, Dale Realizing that form input placeholders aren't universally recognized among browsers, I began changing all of mine using onblur and onfocus handlers instead. As an example, I used the following code, which works in most cases: Code: <input type="text" name="example" maxlength="5" value="Example" onblur="if(this.value=='') this.value='Example';" onfocus="if(this.value=='Example') this.value='';"/> At first, I coded all of the inputs without a value attribute. But, when the page initially loaded, the fields would load empty, and the value/placeholder wouldn't appear until the field had been "focused" and then "blurred" again. Adding the value attribute seemed to correct that problem, again, for the most part. I have some text fields that appear only after I select a particular radio button or select option. Problem is, when the radio is clicked, the field appears, but even with the value attribute in place, the field appears void. I'm not sure what is different, or what I'm doing wrong. Here's the javascript code with the radio button (note:everything works except that the "placeholder" doesn't show when the field first appears): Code: function showfield() {
document.forms[0].otherRelation.value = "";
document.getElementById("newBox").style.display = "none";
var r = document.forms[0].relation;
var len = r.length;
for (var i =0; i<len; i++) {
if (r[i].checked && r[i].value == "Otherrelation" ) {
document.getElementById("newBox").style.display = "inline";
}
}
}
<input type="radio" name="relation" value="Otherrelation" onclick="showfield()"/>Other
<span id = "newBox" style="display:none">:
<input type = "text" name="otherRelation" size="35" value="Your Relationship" onblur="if(this.value=='') this.value='Your Relationship';" onfocus="if(this.value=='Your Relationship') this.value='';"/>
</span>
Thanks for any help. Sorry so long. Hey all, I'm trying to write what I thought to begin with would be a simple script. All it will do is go out and find every textarea, then change the onblur/onfocus functions to something that I created. Here's my problem, when I am going through each textarea object, I can't seem to find a way to reference the object from within the function. See down in that for loop? When I say tAreaSniffer(i), the i ends up being overwritten each time. This makes the value of i in each object to be 3(since there are 3 textareas). I have used javascript in the past, however now I am getting back into it and having trouble. Thanks guys, Here's my code: Code: <html>
<head>
</head>
<body>
<form>
<textarea name="t1" rows="4" cols="20"></textarea>
<textarea name="t2" rows="4" cols="20"></textarea>
<textarea name="t3" rows="4" cols="20"></textarea>
</form>
<script type="text/javascript">
var sniffer;
var textareas = document.getElementsByTagName('textarea');
var counter = 0;
function tAreaSniffer(tArea)//, oldCont)
{
alert(tArea);
//var curCont; = tArea.value;
counter++;
sniffer = setTimeout(function(){tAreaSniffer(tArea)}, 1000);
}
for(var i=0; i<textareas.length; i++)
{
textareas[i].onfocus = function(){tAreaSniffer(i);};//, textareas[i].value);};
textareas[i].onblur = function(){clearTimeout(sniffer);};
}
alert("HEYO");
</script>
</body>
</html>
|
|||||||