|
JavaScript - Prevent My Content From Disappearing
How do I prevent my Link from disappearing??
When I click on the link, "Click Here" It display, "Look At Me!!" but the link, "Click Here" is GONE Is there a way to keep my link, "Click Here" from disappearing? So when I click on the link, "Click Here" the content, "Look At Me!!"should display as well. thanks Here are my codes Code: <html>
<head>
<script type="text/javascript">
function display() {
document.writeln("Look At Me!!");
}
</script>
</head>
<body>
<a href="google.com" onClick="display()">Click Here</a>
</body>
</html>
Similar TutorialsCode is triggered on the following page when mouse position leaves a profile link while logged in: http://www.veinsfetiche.com/forums/ Code: <script type="text/javascript">
// <![CDATA[
// show the popup
function show_popup(UserID) {
if(http_getuser) {
//get user data and show popup
sendRequest(UserID);
}
}
// hide the popup
function close_popup() {
document.getElementById('popup').style.display='none';
}
// Make the request
function createRequestObject() {
if(window.XMLHttpRequest){
ro = new XMLHttpRequest();
} else if(window.ActiveXObject) {
ro = new ActiveXObject("Msxml2.XMLHTTP");
if(!ro) {
ro = new ActiveXObject("Microsoft.XMLHTTP");
}
}
return ro;
}
//Create Request Variables
var http_getuser = createRequestObject();
//Send Request for user info
function sendRequest(UserID) {
var userinfo_url = '{AJAX_USERINFO_PATH}';
http_getuser.open('get', userinfo_url.replace('USERID', UserID));
http_getuser.onreadystatechange = handleResponse;
http_getuser.send(null);
}
// fill in the response
function handleResponse() {
if(http_getuser.readyState == 4 ){
var xmlDoc = http_getuser.responseXML;
if(xmlDoc.hasChildNodes()) {
document.getElementById('ajax_username').innerHTML = xmlDoc.getElementsByTagName('username')[0].firstChild.nodeValue;
document.getElementById('ajax_registert').innerHTML = xmlDoc.getElementsByTagName('regdate')[0].firstChild.nodeValue;
document.getElementById('ajax_posts').innerHTML = xmlDoc.getElementsByTagName('posts')[0].firstChild.nodeValue;
document.getElementById('ajax_website').innerHTML = xmlDoc.getElementsByTagName('website')[0].firstChild.nodeValue;
document.getElementById('ajax_from').innerHTML = xmlDoc.getElementsByTagName('from')[0].firstChild.nodeValue;
document.getElementById('ajax_last_visit').innerHTML = xmlDoc.getElementsByTagName('lastvisit')[0].firstChild.nodeValue;
document.getElementById('ajax_rank').innerHTML = xmlDoc.getElementsByTagName('rank')[0].firstChild.nodeValue;
document.getElementById('ajax_avatar').innerHTML = xmlDoc.getElementsByTagName('avatar')[0].firstChild.nodeValue; //document.getElementById('ajax_add').innerHTML = xmlDoc.getElementsByTagName('add')[0].firstChild.nodeValue;
//Apply style which makes profile info visible
document.getElementById('popup').style.display='block';
//Get height of popup
var getRefById = function() {return null;};
if(document.getElementById) {
getRefById = function(i) {return document.getElementById(i);};
} else if(document.all) {
getRefById = function(i) {return document.all[i] || null;};
}
var d = getRefById('popup'), h = '0px', o;
if(d) {
if((o = document.defaultView) && o.getComputedStyle) {
h = o.getComputedStyle(d, null).height;
} else if('number' == typeof d.offsetHeight) {
h = d.offsetHeight + 'px';
}
}
// 'h' should now contain the height of 'myDiv', or 0px
//alert(h);
//make room for popup
document.getElementById('test').style.height= h;
}
}
}
// set popup to mouse possition
function set_div_to_mouse(e) {
//Make x and y cord vars
var docX, docY;
//get page info
if(e) {
if(typeof(e.pageX) == 'number') { docX = e.pageX; docY = e.pageY;}
else {docX = e.clientX; docY = e.clientY;}
//vert
} else {
e = window.event;
docX = e.clientX; docY = e.clientY;
if(document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
docX += document.documentElement.scrollLeft; docY += document.documentElement.scrollTop;
}
else if(document.body && (document.body.scrollTop || document.body.scrollLeft)) {
docX += document.body.scrollLeft; docY += document.body.scrollTop;
}
}
//hor
if (docX > document.body.offsetWidth - 400) {
document.getElementById('popup').style.left = (docX - 350) + "px";
} else {
document.getElementById('popup').style.left = (docX - 5) + "px";
}
document.getElementById('popup').style.top = (docY + 30) + "px";
}
//document.onmousemove = set_div_to_mouse;
// ]]>
</script>
<div id="test">
<div class="forabg" id="popup" style="width: 90%;">
<div class="inner">
<span class="corners-top"><span></span></span>
<ul class="topiclist fullwidth">
<li class="header"><dl><dt>{L_READ_PROFILE}</dt></dl></li>
</ul>
<ul class="topiclist forums">
<li><dl>
<dd style="width:100%">
<table> <tr> <td><div id="ajax_avatar"></div></td> <td><strong>{L_USERNAME}:</strong> <span id="ajax_username"></span><br /> <strong>{L_TOTAL_POSTS}:</strong> <span id="ajax_posts"></span><br /> <strong>{L_SORT_RANK}:</strong> <span id="ajax_rank"></span><br /> <strong>{L_JOINED}:</strong> <span id="ajax_registert"></span><br /> <strong>{L_LAST_VISIT}:</strong> <span id="ajax_last_visit"></span><br /> <strong>{L_LOCATION}:</strong> <span id="ajax_from"></span><br /> <strong>{L_WEBSITE}:</strong> <span id="ajax_website"></span><br/> <span id="ajax_add"></span> </tr> </table>
<br/ style="clear: both;">
</dd>
</dl></li>
</ul>
<span class="corners-bottom"><span></span></span>
</div>
</div>
</div>
When my code hits line 80, the height of a div tag is increased to make room for expanding content, so that the new content does not overlap already existing content. When the div tag's height increases, this increases the overall page height. When the page height increases, then the scroll bar stays in the same place, but the page position changes in the browser. Is there anyway to prevent the viewer's position from changing when room is made for the expanding content? On my home page i have a form which accepts data and on clicking the accept 'button' executes a javascript routine that process' the data, sets a cookie, and sends the user to an appropriate page. the set cookie data is as follows: Code: var expire=(new Date(2099, 1, 1)).toGMTString(); document.cookie = "cookie=privg; expires="+expire; window.location = "vip-skincare-online-shopping.html"; so far so good - i can hop about the pages on the website no problem but.... if i return to the home page that contains the original form, the cookie is deleted. This happens immediately i arrive at the page - i don't use the form. Can anyone suggest why this might be happening? I don't access the cookie anywhere else on that page, and the only other javascript on the page is google analytics stuff. Hi, The following code is supposed to display and hide fields when clicking on radio buttons which is does correctly, it also gives the fields that are hidden a value so that it passes validation. T The problem is that when the user moves from one field to the next, it deletes the value that they have just entered. :S Any ideas why this might occur? Thanks! Code: <script language="javascript" type="text/javascript">
function showHideDivs(){
var category = '';
for(i=0; i < oRadBtns.length; i++){
if(oRadBtns[i].checked){
category = oRadBtns[i].value;
}
}
switch (category){
case 'empresa':
document.getElementById("empresa_nombre").value = "";
document.getElementById("contacto").value = "";
document.getElementById("nombre").style.display = "none";
document.getElementById("apellido").style.display = "none";
document.getElementById("company").style.display = "block";
document.getElementById("contact").style.display = "block";
document.getElementById("firstname").value = "nombre";
document.getElementById("lastname").value = "apellido";
break;
case 'particular':
document.getElementById("firstname").value = "";
document.getElementById("lastname").value = "";
document.getElementById("nombre").style.display = "block";
document.getElementById("apellido").style.display = "block";
document.getElementById("company").style.display = "none";
document.getElementById("contact").style.display = "none";
document.getElementById("empresa_nombre").value = "empresa";
document.getElementById("contacto").value = "contacto";
break;
}
}
window.onload=function(){
oRadBtns = document.getElementById('dmsfrm').getElementsByTagName('input');
for(i=0; i < oRadBtns.length; i++){
oRadBtns[i].onclick = showHideDivs;
}
showHideDivs();
}
</script>
Code: <div class="radio_element">
<input type="radio" value="empresa" class="radio" id="empresa" name="categoria" <?php echo ($leadsEngine->getElementValue('categoria')!='particular')?'checked="checked"':'' ?> />
<span class="<?PHP if($leadsEngine->hasError('categoria')){echo 'error';} ?> ">Empresa</span>
</div>
<div class="radio_element">
<input type="radio" value="particular" class="radio" id="particular" name="categoria" <?php echo ($leadsEngine->getElementValue('categoria')=='particular')?'checked="checked"':'' ?> />
<span class="<?PHP if($leadsEngine->hasError('categoria')){echo 'error';} ?> ">Particular</span>
</div>
</div>
I have a form with multiple text entry fields. Some are input fields, and one is a textarea. I have the script (below) for a textarea in a form, to ensure that there is a max of 1500 characters. I am having two problems. 1) If there is an error on the form (for whatever reason), all of the text that was entered in the texarea, gets lost when the page reloads (this only happens for the textarea, the other input fields reprint the text). 2) When ever I try to press the "Tab" button on my keyboard, to tab out of the textarea to the next text box, it does not tab to the "next" text box, but instead it tabs "back" to the previous text box in the form. Here's what I have: Code: <head>
<script type="text/javascript">
function ismaxlength(obj){
var mlength=obj.getAttribute? parseInt(obj.getAttribute("maxlength")) : ""
if (obj.getAttribute && obj.value.length>mlength)
obj.value=obj.value.substring(0,mlength)
}
</script>
</head>
<form>
<tr>
<td colspan="2"><textarea maxlength="1500" onkeyup="return ismaxlength(this)"
name="blah_post" tabindex="1" style="display: block; width: 340px; height: 150px;"
cols="60" rows="10" value="<?php print $blah_post;?>"></textarea></td>
</tr>
</form>
Don't remember where I found the script but, I'm open to more simpler javascript suggestions as well.... I'm using two simple CSS rollovers for a prev/next arrow nav, combined with a JS script that lets the user manually tab/flip/swap through a few testimonials. You roll over the "next" button, it's highlighted, you click it, a new testimonial appears in place of the old one. Problem: the prev/next buttons are appearing and disappearing on click, seemingly randomly. I can't make any sense of it. Image: http://img3.imageshack.us/img3/8924/jsproblem.jpg I've tried adjusting the CSS container sizes, tried changing the positioning and even adding z-indexes in case the divs are accidentally overlapping. Gave items background colors to try to see the structure more clearly, for flaws. Nothing has worked. Any help much appreciated. I'm using this JS script for the tabs: Code:
last_tab = 'tabTest1';
function show(layerName) {
document.getElementById(layerName).style.display = '';}
function hide(layerName) {
document.getElementById(layerName).style.display = 'none';}
function show_next(tab_name) {
document.getElementById(last_tab).className = '';
var curr = document.getElementById(tab_name);
curr.className='';
hide(last_tab+'_data');
show(tab_name+'_data');
last_tab=tab_name;}
and this HTML: Code:
<!-- start: testimonials -->
<div id="tabTest1_data">
<div class="silo1">
<div class="spotlightnav-content-header-container">
<p class="spotlightnav-content-title">Testimonials</p>
<a href="#" class="spotlightnav-content-more">View All</a>
</div>
<div class="content-container">
<p class="spotlightnav-testimonials">
<span class="color1">"</span>Excellent staff very courteous, friendly and professional, excellent stay, excellent meal.<span class="color1">"</span>
</p>
<p class="spotlightnav-testimonials-credit">Janice, Georgia</p>
</div>
<div class="spolightnav-btns-container">
<a href="#" onClick="javascript:show_next('tabTest6'); return false;" id="tabTest6" class="spotlightnav-btn-left"><img src="images/clear.gif" width="24" height="24" /></a>
<a href="#" onClick="javascript:show_next('tabTest2'); return false;" id="tabTest2" class="spotlightnav-btn-right"><img src="images/clear.gif" width="24" height="24" /></a>
</div>
</div>
</div>
<div id="tabTest2_data" style="display: none;">
<div class="silo1">
<div class="spotlightnav-content-header-container">
<a href="#" class="spotlightnav-content-title">Testimonials</a>
<a href="#" class="spotlightnav-content-more">View All</a>
</div>
<div class="content-container">
<p class="spotlightnav-testimonials">
<span class="color1">"</span>Absolutely marvelous. No problems.<span class="color1">"</span>
</p>
<p class="spotlightnav-testimonials-credit">Christine, Taiwan</p>
</div>
<div class="spolightnav-btns-container">
<a href="#" onClick="javascript:show_next('tabTest1'); return false;" id="tabTest1" class="spotlightnav-btn-left"><img src="images/clear.gif" width="24" height="24" style="height: 24px; width: 24px;" /></a>
<a href="#" onClick="javascript:show_next('tabTest3'); return false;" id="tabTest3" class="spotlightnav-btn-right"><img src="images/clear.gif" width="24" height="24" style="height: 24px; width: 24px;" /></a> </div>
</div>
</div>
<div id="tabTest3_data" style="display: none;">
<div class="silo1">
<div class="spotlightnav-content-header-container">
<a href="#" class="spotlightnav-content-title">Testimonials</a>
<a href="#" class="spotlightnav-content-more">View All</a>
</div>
<div class="content-container">
<p class="spotlightnav-testimonials">
<span class="color1">"</span>Absolutely marvelous. No problems.<span class="color1">"</span>
</p>
<p class="spotlightnav-testimonials-credit">Belle, Taiwan</p>
</div>
<div class="spolightnav-btns-container">
<a href="#" onClick="javascript:show_next('tabTest2'); return false;" id="tabTest2" class="spotlightnav-btn-left"><img src="images/clear.gif" width="24" height="24" /></a>
<a href="#" onClick="javascript:show_next('tabTest4'); return false;" id="tabTest4" class="spotlightnav-btn-right"><img src="images/clear.gif" width="24" height="24" /></a> </div>
</div>
</div>
<div id="tabTest4_data" style="display: none;">
<div class="silo1">
<div class="spotlightnav-content-header-container">
<a href="#" class="spotlightnav-content-title">Testimonials</a>
<a href="#" class="spotlightnav-content-more">View All</a>
</div>
<div class="content-container">
<p class="spotlightnav-testimonials">
<span class="color1">"</span>Vaguely not-terrible. Acceptable in a somewhat amazing way. ffffffffuuuuuuuuu<span class="color1">"</span>
</p>
<p class="spotlightnav-testimonials-credit">Grace, Texas</p>
</div>
<div class="spolightnav-btns-container">
<a href="#" onClick="javascript:show_next('tabTest3'); return false;" id="tabTest3" class="spotlightnav-btn-left"><img src="images/clear.gif" width="24" height="24" /></a>
<a href="#" onClick="javascript:show_next('tabTest5'); return false;" id="tabTest5" class="spotlightnav-btn-right"><img src="images/clear.gif" width="24" height="24" /></a> </div>
</div>
</div>
<div id="tabTest5_data" style="display: none;">
<div class="silo1">
<div class="spotlightnav-content-header-container">
<a href="#" class="spotlightnav-content-title">Testimonials</a>
<a href="#" class="spotlightnav-content-more">View All</a>
</div>
<div class="content-container">
<p class="spotlightnav-testimonials">
<span class="color1">"</span>Damn fine place, yo.<span class="color1">"</span>
</p>
<p class="spotlightnav-testimonials-credit">Slim, Bacon</p>
</div>
<div class="spolightnav-btns-container">
<a href="#" onClick="javascript:show_next('tabTest4'); return false;" id="tabTest4" class="spotlightnav-btn-left"><img src="images/clear.gif" width="24" height="24" /></a>
<a href="#" onClick="javascript:show_next('tabTest6'); return false;" id="tabTest6" class="spotlightnav-btn-right"><img src="images/clear.gif" width="24" height="24" /></a> </div>
</div>
</div>
<div id="tabTest6_data" style="display: none;">
<div class="silo1">
<div class="spotlightnav-content-header-container">
<a href="#" class="spotlightnav-content-title">Testimonials</a>
<a href="#" class="spotlightnav-content-more">View All</a>
</div>
<div class="content-container">
<p class="spotlightnav-testimonials">
<span class="color1">"</span>Blurry. But good.<span class="color1">"</span>
</p>
<p class="spotlightnav-testimonials-credit">Bob, California</p>
</div>
<div class="spolightnav-btns-container">
<a href="#" onClick="javascript:show_next('tabTest5'); return false;" id="tabTest5" class="spotlightnav-btn-left"><img src="images/clear.gif" width="24" height="24" /></a>
<a href="#" onClick="javascript:show_next('tabTest1'); return false;" id="tabTest1" class="spotlightnav-btn-right"><img src="images/clear.gif" width="24" height="24" /></a> </div>
</div>
</div>
I'm assuming this is primarily a JS problem, but if taking a look at the CSS is necessary, let me know and I'll post it. THANKS!!!!! http://vietnamthereandback.com/mainpage.html The arrows next to the songs previews are randomly appearing/disappearing on page refresh. There are always 8 arrows, but each refresh shows the arrows in different places. This has really got me stumped. If anyone has any thoughts, I'd really appreciate hearing them. The basic button/arrow code is below. The only thing that changes in the MP3 file name. <code> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0" width="30" height="30"> <PARAM NAME=movie VALUE="http://www.vietnamthereandback.com/Clips/audioplay.swf?file=http://www.vietnamthereandback.com/Clips/reflections.mp3&auto=no&sendstop=yes&repeat=1&buttondir=http://www.vietnamthereandback.com/Clips/buttons/negative_small&bgcolor=0xffffff&mode=playpause"> <PARAM NAME=quality VALUE=high> <PARAM NAME=wmode VALUE=transparent> <embed src="http://www.vietnamthereandback.com/Clips/audioplay.swf?file=http://www.vietnamthereandback.com/Clips/reflections.mp3&auto=no&sendstop=yes&repeat=1&buttondir=http://www.vietnamthereandback.com/Clips/buttons/negative_small&bgcolor=0xffffff&mode=playpause" quality=high wmode=transparent width="30" height="30" align="" TYPE="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed></object> </code> I'm trying to understand how forms, data, php, javascript all work together. So 1) I hardcoded some html form fields with values using php using "echo", then 2) I dynamically created some more html form fields with values using javascript using "createElement" and appending to the html form element. When I click on the submit form, the php created form fields still show on the webpage, but the javascript dynamically created form fields disappear. Can anyone shed some light for me? Why are the javascript created form fields disappearing when I click on submit and not the PHP created form fields? Thank you! Code: <form method="post" id="commentform" action="<?php echo $PHP_SELF?>"> Hello, Is there anyway to prevent images, words, divisions, etc from being selected? Also if something is selected is there a way to deselect? Thanks! Hello. I'm using the keyup event for an input box to check for the Escape key (keyCode 27). I'm then using this to hide a related select element. It works okay apart from IE(8) of course . How can I prevent IE carrying on with its normal Escape behaviour? If tried a number of things, most recently: Code: e.cancelBubble = true; if ( e.stopPropagation ) e.stopPropagation(); return false; but it, IE, is insistant. I tried switching to 'keydown' but it went a bit wonky.. Andy. I retrieve a list of links from a database using ajax, then I assign them to the innerHTML property of a div whose display property is set to "none" Then I set the display property to "display" to get a drop-down listbox. The problem is the links in the list are all hilighted like they've been dragged over by a mouse. How do I prevent these links from highlighting? Hey! I searched a while on the web for this but i didn't find a solution that really worked. So is there a way how i can prevent IE9 from scrolling when i use the arrow keys? I have a tracking ad at the bottom of my site. (no iframes). how do I know and/or prevent that tracking ad from popping up a popup? They are not suppose to, but I suspect they do. Is there a way to track this, or perhaps prevent them from popping the popup from within my page? I have access to various libraries, prototype/jquery etc.. so if there is a func/method in those, I could use too. Code: 1 ,<input id="14sq-und-0-value" size="12" maxlength="10" class="form-text" type="text"> 2 ,<input id="510sq-und-0-value" size="12" maxlength="10" class="form-text" type="text"> 3 ,<input id="1119sq-und-0-value" size="12" maxlength="10" class="form-text" type="text"> 4, <input id="20jsq-und-0-value" size="12" maxlength="10" class="form-text" type="text"> 5 ,<input id="oneyear-und-0-value" maxlength="10" class="form-text" type="text"> 6 ,<input id="twoyear-und-0-value" maxlength="10" class="form-text" type="text"> 7 ,<input id="threeyear-und-0-value" size="12" maxlength="10" class="form-text" type="text"> 8 <input id="vpssq-und-0-value" size="12" maxlength="10" class="form-text" type="text"> 9 <input id="500zh-und-0-value" size="12" maxlength="10" class="form-text" type="text"> 10 <input id="1000zh-und-0-value" size="12" maxlength="10" class="form-text" type="text"> 11 <input id="1500zh-und-0-value" size="12" maxlength="10" class="form-text" type="text"> now, i want to do, if the editor type content to 1, 2, 3 4 input box and finished namely the 1 ,2,3 4have value , then he can't type anything to the rest. if the 5,6,7, input box has value. then can't type anything to the rest. if the 8, input box has value. then can't type anything to the rest. if the9,10,11, input box has value. then can't type anything to the rest. Hi all, I am facing problem in preventing my web page being loaded into an iFrame. I search in internet and found this solution : if (self == top) document.documentElement.style.display = 'block'; else top.location = self.location; The above java script code is simple redirecting me to the home page of my web site. But I donot want that kind of solution. When anybody tried to access my web page through iFrame, it should show an error message like "The content of the web site cannot be loaded into an IFrame". This message should be displayed inside the iFrame. For example, if we tried to access "google.com" site in an iframe, the website should not allow the iframe object to load into it, insted it will display an error message along with a provision to open webiste with an external link with it. Any help? thanks, -Sanath Please, I need a code that is capable of preventing SEOQuake from loading on my websites, even if a user has installed the plug-in. For example, Google, Yahoo and Bing implements such feature. I just don't want it to load whenever anybody visits my sites. I've run into a glitch in my little calculator form. Apparently, in Safari, when you hit the enter key while the cursor is in an input field, it will attempt to submit the form. I don't want this to happen. Submitting serves no purpose in this, because all of the functionality is in the script on the page. I copied most of the HTML from an example, and noted that the form tag didn't contain an action= parameter. I tried adding this with the hopes that it would override Safari's default submit action. They do affect its behavior, but not in a way that does any good. First, I tried: action="" which didn't work Then, I tried: action="CalcRange()" This is a harmless function that normally runs on field change. It didn't work either. In every case Safari is determined to fire off a URL. No problems with MSIE or Firefox. Is there another way of using the action parameter to fix the problem, or do I have to attack this another way. Thanks. Code: <html><head><title></title>
<script language="JavaScript">
var d = null;
function PadCalc(ctrm,cvlo,cvhi,cstray,rc) {
chp = cvhi+ctrm;
clp = cvlo+ctrm;
beta=(rc-1)*cstray;
a=rc* clp- chp +beta;
b= (rc-1)*clp*chp+beta*(clp + chp);
c=beta*clp* chp;
cser=(-b-Math.sqrt(b*b-4*a*c))/(a+a);
return(cser);
}
function TrmCalc(cser,cvlo,cvhi,cstray,rc) {
if (cser<0.00001) {
ctrm=(cvhi+cstray-rc*(cvlo+cstray))/(rc-1);
}
else {
cser2=cser*cser;
k0=(1-rc)*cstray;
k1=k0*cser2;
k2=k0*cser+cser2;
k3=k0*cser-rc*cser2;
k4=k0+(1-rc)*cser;
a=k4;
b=k2+k3+k4*(cvlo+cvhi);
c=k1+k2*cvhi+k3*cvlo+k4*cvlo*cvhi;
ctrm=(-b-Math.sqrt(b*b-4*a*c))/(a+a);
}
return(ctrm);
}
function setCellTxt(id,tx,clr){
cell=document.getElementById(id);
cell.innerHTML=tx;
cell.style.color=clr;
}
function CalcAll() {
setCellTxt("ex_cpar","***","#FF0000");
setCellTxt("ex_cser","***","#FF0000");
setCellTxt("ex_L","***","#FF0000");
flo = parseFloat(d.ef_flo.value);
fhi = parseFloat(d.ef_fhi.value);
cvlo = parseFloat(d.ef_cvlo.value);
cvhi = parseFloat(d.ef_cvhi.value);
cstray = parseFloat("0".concat(d.ef_cstray.value));
KVal = parseFloat(d.ef_KVal.value);
spi = 500000.0/Math.PI;
rf=fhi/flo;
rc=rf*rf;
switch(d.mknown.selectedIndex){
case 0:
// For Given inductor
L = KVal;
w=(spi/flo)
chppp = w*w/L;
w=(spi/fhi)
clppp = w*w/L;
alpha = cstray-chppp;
beta = cstray-clppp;
k1 = cvhi-chppp-cvlo+clppp;
k2 = alpha - beta;
k3 = alpha*cvhi - beta*cvlo;
k4 = alpha*cvhi;
k5 = cvhi + alpha;
a = -k2/k1;
b = alpha-(k3+k2*k5)/k1;
c = k4-(k3*k5)/k1;
ctrm = (-b+Math.sqrt(b*b-4*a*c))/(a+a);
cser = -(k2*ctrm+k3)/k1;
if (cser>100*cvhi) cser=0;
// End of given L calc
break;
case 1:
// For Given Padder
cser=KVal;
if (cser<.00001) {
cpinv=0;
}
else {
cpinv=1/cser;
}
ctrm=TrmCalc(cser,cvlo,cvhi,cstray,rc);
chp=cvhi+ctrm;
chppp=1/(1/chp+cpinv)+cstray;
w=spi/flo;
L=w*w/chppp;
break;
case 2:
// For Given Trimmer
ctrm=KVal;
cser=PadCalc(ctrm,cvlo,cvhi,cstray,rc);
chppp=chp*cser/(chp+cser)+cstray;
if (cser>100*cvhi) cser=0;
w=spi/flo;
L=w*w/chppp
break;
}
badVal=false;
if (isNaN(ctrm) || ctrm<0) badVal=True;
if (isNaN(cser) || cser <0) badVal=True;
if (isNaN(L) || L<0) badVal=True;
if (!badVal) {
setCellTxt("ex_cpar",ctrm.toFixed(2),"#000080");
setCellTxt("ex_cser",cser.toFixed(2),"#000080");
setCellTxt("ex_L",L.toFixed(2),"#000080");
}
}
function CalcRange() {
flo = parseFloat(d.ef_flo.value);
fhi = parseFloat(d.ef_fhi.value);
cvlo = parseFloat(d.ef_cvlo.value);
cvhi = parseFloat(d.ef_cvhi.value);
cstray = parseFloat("0".concat(d.ef_cstray.value));
if (flo>0 && fhi>0 && cvlo>0 && cvhi>0) {
spi = 500000.0/Math.PI;
rf=fhi/flo;
rc=rf*rf;
csmin=PadCalc(0,cvlo,cvhi,cstray,rc);
ctmax=TrmCalc(0,cvlo,cvhi,cstray,rc);
w=spi/flo
chppp=cvhi*csmin/(cvhi+csmin)+cstray;
Lmax=w*w/chppp;
chppp=cvhi+ctrm+cstray;
Lmin=w*w/chppp;
//Reset exact calc outputs after input parameter change
/*
setCellTxt("ex_cpar","","#000080");
setCellTxt("ex_cser","","#000080");
setCellTxt("ex_L","","#000080");
*/
if (Lmin<0 || Lmax<0 || ctmax<0 || csmin<0) {
setCellTxt("rTrm","***","#FF0000");
setCellTxt("rPad","***","#FF0000");
setCellTxt("rInd","***","#FF0000");
}
else {
setCellTxt("rTrm","0 ... ".concat(ctmax.toFixed(2)),"#000080");
setCellTxt("rPad",">= ".concat(csmin.toFixed(2)," (if present)"),"#000080");
setCellTxt("rInd","".concat(Lmin.toFixed(2)," ... ",Lmax.toFixed(2)),"#000080");
}
}
}
function kvChange() {
descriptions = Array ("Enter Inductance Value (µH):","Enter Series Capacitance Value (pF):","Enter Parallel Capacitance Value: (pF)");
setCellTxt("KVdescription",descriptions[d.mknown.selectedIndex],"#000080");
setCellTxt("ex_cpar","","#000080");
setCellTxt("ex_cser","","#000080");
setCellTxt("ex_L","","#000080");
}
</script>
</head>
<body onload="d = document.forms[0];">
<center>
<h2>Bandspread Calculator</h2>
</center>
<form >
<table style="width: 692px; height: 400px;" align="center"
border="0">
<tbody>
<tr>
<td align="center" colspan=2"><B>Input Parameters:</B></td>
</tr>
<tr>
<td align="right">Lowest Frequency (kHz):</td>
<td><input name="ef_flo" onchange="CalcRange()" size="18"> </td>
</tr>
<tr>
<td align="right">Highest Frequency (kHz):</td>
<td><input name="ef_fhi" onchange="CalcRange()" size="18"> </td>
</tr>
<tr>
<td align="right">Tuning Capacitor <I>C<sub>V</sub></I> Minimum Capacitance (pF):</td>
<td><input name="ef_cvlo" onchange="CalcRange()" size="18"> </td>
</tr>
<tr>
<td align="right">Tuning Capacitor <I>C<sub>V</sub></I> Maximum Capacitance (pF):</td>
<td><input name="ef_cvhi" onchange="CalcRange()" size="18"> </td>
</tr>
<tr>
<td align="right">Stray Capacitance <I>C<sub>S</sub></I> (pF):</td>
<td><input name="ef_cstray" onchange="CalcRange()" size="18"> </td>
</tr>
<tr>
<td align="center" colspan=2"><HR></td>
</tr>
<tr>
<td align="center" colspan=2"><B>Allowable Component Ranges:</B></td>
</tr>
<tr>
<td align="right">Trimmer Capacitor <I>C<sub>T</sub></I> (pF): </td>
<td align="left" id="rTrm"><font color="#FF0000">***</font></td>
</tr>
<tr>
<td align="right">Padder Capacitor <I>C<sub>P</sub></I> (pF): </td>
<td align="left" id="rPad" ><font color="#FF0000">***</font></td>
</tr>
<tr>
<td align="right">Inductor (µH): </td>
<td align="left" id="rInd"><font color="#FF0000">***</font></td>
</tr>
<tr>
<td align="center" colspan=2"><HR></td>
</tr>
<tr>
<td align="center" colspan=2"><B>Exact Value Calculation:</B></td>
</tr>
<tr>
<td align="right">Choose the Known Component:</td>
<td>
<select name="mknown" onchange="kvChange()" size="1">
<option selected="selected">Inductor</option>
<option>Padder Capacitor (Series)</option>
<option>Trimmer Capacitor (Parallel)</option>
</select>
</td>
</tr>
<tr>
<td id="KVdescription" align="right">Enter the Known Component Value:</td>
<td><input name="ef_KVal" size="18"></td>
</tr>
<tr>
<td align="right">Click to Calculate the Unknown Components:</td>
<td><input type="button" value="Calculate" onclick="CalcAll()"> </td>
</tr>
<tr>
<td align="right">Trimmer Capacitor <I>C<sub>T</sub></I> (pF): </td>
<td id="ex_cpar" > </td>
</tr>
<tr>
<td align="right">Padder Capacitor <I>C<sub>P</sub></I> (pF): </td>
<td id="ex_cser"> </td>
</tr>
<tr>
<td align="right">Inductor (µH): </td>
<td id="ex_L"> </td>
</tr>
</tbody>
</table>
</form>
</body></html>
Edit: I should also add that my web page is made using Apple's iWeb software, and it stores the above code in a separate file, and then uses the following iframe code to load it: Code: <iframe id="widget1-frame" src=".//BandspreadCalc_files/widget1_markup.html" frameborder="0" style="width: 100%; height: 100%;" scrolling="no" marginheight="0" marginwidth="0" allowTransparency="true"></iframe> So, when Safari submits the form, the result is that it loads a page containing only the widget1_markup.html code, and not the parent page. Either way, it's annoying, because any data that the user has entered in a field will be erased. Hello. I have what I think is a simple request, but I'm not quite sure how to go about it. I hope you can help me! Problem: I am building an online store and need to restrict checkout unless a customer has bought at least $20 worth of items. If they have >$20, they can check out. If they have <$20, they should get an error when they click the checkout button that explains that there is a $20 minimum. I don't want them to be able to checkout, so maybe I also need to disable the button or hide it? Here are the two elements in my HTML: The total price div: Code: <div id="totalprice">{tag_productgrandtotal}</div>
The checkout button: Code: {tag_buybutton,<img alt="" src="/CatalystImages/shop_checkout.png" />}
Here is what I've tried to put together with my bare minimum knowledge of Javascript: Code: <body onload="checkOut()">
<script type="text/javascript">
function checkOut() {
var tp = document.getElementById('totalprice').innerHTML;
tp = tp.replace(/[^0-9$\.]/g,""); // strip anything except numbers decimals and $ sign
if (tp < "$20.00") {
????????????????
}
else {
?????????????????
}
}
</script>
I'm not sure the top part is correct, and where I've put "?????" I have no idea what to do to deactivate the checkout button and produce the error message. Thank you SO much for any help you can provide. I have a set of text boxes sharing the same name that I want to validate onSubmit. If a duplicate is found, I want to alert the user and prevent the form from submitting. How would I check the text boxes for duplicates? Code: <script type="text/javascript">
function Validate() {
var obj = document.getElementsByName('keyword');
var i = 0;
var rows = obj.length;
for (i=0; i<rows; i++) {
if (obj[i].value == any of the other text boxes {
alert('A duplicate was found.');
return false;
}
}
</script>
<form method="post" action="" onSubmit="return Validate();">
<input id="k1" name="keyword" /><br />
<input id="k2" name="keyword" /><br />
<input id="k3" name="keyword" /><br />
<input id="k4" name="keyword" /><br />
<input id="k5" name="keyword" /><br />
<input type="Submit" value="Submit" />
</form>
I wish for my users to retype their email address instead of the copy and paste method to ensure they have typed it correctly both times. How could this be done, would it be Javascript ? |
|||||||