|
JavaScript - Calling Javascript On Page Load
Hi - I have an ASP.Net 2.5 application and I need to call a javascript function when one of the pages loads initially. I've tried:
Code: string ScriptToCall = @"EnableCheckboxes(" + cblDetails.ClientID + ", false);";
ClientScript.RegisterStartupScript(this.GetType(), "addScript", ScriptToCall, true);
where EnableCheckboxes is a javascript function on the page. This doesn't work (doesn't disable the CheckBoxList), although the EnableCheckboxes function DOES work when I call it in other ways, so I'm sure that the problem is that I'm not calling it properly on page load. I've tried: Code: ClientScript.RegisterStartupScript(this.GetType(), "addScript", "alert('Hello');", true);
which DOES work, so I know I'm on the right track, but how do I do this? Thanks! Similar TutorialsHi, The point is to have a PHP code on the same page as a javascript calling the PHP function. I am able to make this work when the PHP code is on an external file. But when all but XSL are on the same page, it won't do what it should. How to make this work? The PHP is correct as it is by its self. And so is the javascript as it is for calling other PHP code. The combination of these two in this case just won't work. PHP and Javascript: [CODE] <html ><head><title>Untitled 1</title></head> <body> <?php function dateToDayOfWeek($xmlDate, $useFormat = 'l') { $rd = 'Unknown'; if (count($xmlDate) == 1) { $element = $xmlDate[0]; if ($element instanceof DOMElement) { $rd = date($useFormat, strtotime($element->nodeValue)); } } return $rd; } function axasal(){ date_default_timezone_set('UTC'); $xslDoc = new DOMDocument(); $xslDoc->load("xslfile.xsl"); // Here comes the xsl file name. $xmlDoc = new DOMDocument(); $xmlDoc->load("http://free.worldweatheronline.com/feed/weather.ashx?q=milan,italy&format=xml&num_of_days=5&key=af8b2fc417222733111712"); $proc = new XSLTProcessor(); $proc->registerPHPFunctions('dateToDayOfWeek'); $proc->importStylesheet($xslDoc); echo $proc->transformToXML($xmlDoc); } ?> <script type="text/javascript"> function call_php(){ document.getElementById("place").innerHTML="<?php echo axasal(); ?>"; } </script> <form name = "form"> <input type = "button" name = "aaa" id = "aaa" value = "Click me" onclick = "call_php()" /> </form> <div id="place"></div> </body></html> [CODE] XSL: [CODE] <?xml version="1.0"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlnshp="http://php.net/xsl"> <xsl:template match="data"> <html> <head><title></title></head> <body> <table> <tr> <xsl:apply-templates select="./weather" /> </tr> </table> </body> </html> </xsl:template> <xsl:template match="weather"> <td style="width: 97px"> <p><xsl:value-of select="php:function('dateToDayOfWeek', date)" /></p> <p><xsl:apply-templates select="./weatherIconUrl" /></p> </td> </xsl:template> <xsl:template match="weatherIconUrl"> <img> <xsl:attribute name="src"> <xsl:value-of select="." /> </xsl:attribute> </img> </xsl:template> </xsl:stylesheet> [CODE] The smiley face on the second line of the last code is ':' and 'p'. Hello! I am developing my personal website! And I am trying to implement it with JS completely. which means I need the page to be one front end page. But the back-end pages would be the ones which do the work and calculations! In other words and more explaination: I would like to have one "index.php" page that contains only a nav bar which handles the mission. Once the page load it loads with the content of "home.php" (the landing page) if the "contact" tab is clicked then I would like to load the "ContactMe.php" page content. I have done this already! but the problem is: "home.php" uses alot of javascript functions and jquery plug-ins. when I load it, it looks messy that you think the JS is disabled in your machine :-\ Note: the loading has been done with those methods: .load(), $.ajax! -> same results! The conclusion: * "home.php" * "ContactMe.php" * "About.php" Is it possible to load those pages in the "index.php" and still have their JS functions function correctly and display as if they were accessed individually? The goal that I am trying to achieve is that I make my whole website for the visitor as "One Page Site"! I am challenging myself with it though! Thank you in advance for your informative posts! Please Note that I have only put the <html><head><body> tags in the index.php and removed them from the back-end pages such as home.php, contactme.php and about.php! for that sake that it works correctly! but with no hope! hello Friends In my jsp project i am using the calendar control which selects the Birth Date of the client and on that basis it calculates the age after completion of all the fields user get registered successfully.but when registered user trying to update his date of birth his age field is blank please tell me why this happening Also please tell me the javascript function My jsp code is: Code: <%@page import="java.lang.reflect.Array"%>
<%@ taglib uri="/WEB-INF/struts-bean.tld" prefix="bean" %>
<%@ taglib uri="/WEB-INF/struts-html.tld" prefix="html" %>
<%@ taglib uri="/WEB-INF/struts-logic.tld" prefix="logic" %>
<%@page import="java.util.ArrayList"%>
<%@page import="com.udhc.model.City"%>
<%@page import="com.udhc.model.User" %>
<%@page import="com.udhc.model.Country"%>
<%@page import="com.udhc.model.State"%>
<%@page import="com.udhc.config.ApplicationConstant"%>
<%@page import="org.apache.struts.Globals" %>
<%@page import="com.udhc.utility.CommanUtility"%>
<%@page import="java.util.HashMap"%>
<%@page import="com.udhc.form.UserForm"%>
<%@page import="com.udhc.utility.DateUtlity"%>
<%@page import="java.util.Calendar"%>
<jsp:include page="Header.jsp"></jsp:include>
<link type="text/css" href="css/jquery.ui.core.css" rel="stylesheet" />
<link type="text/css" href="css/jquery.ui.datepicker.css" rel="stylesheet" />
<link type="text/css" href="css/jquery.ui.theme.css" rel="stylesheet" />
<link type="text/css" href="css/calendar.css" rel="stylesheet"></link>
<script type="text/javascript" language="javascript" src="js/jquery.js"></script>
<script type="text/javascript" language="javascript" src="js/jquery.ui.core.js"></script>
<script type="text/javascript" language="javascript" src="js/jquery.ui.widget.js"></script>
<script type="text/javascript" language="javascript" src="js/jquery.datepicker.js"></script>
<script type="text/javascript" language="javascript" src="js/calendar.js"></script>
<script type="text/javascript">
<%
User user= (User)session.getAttribute(ApplicationConstant.UDHC_USER_MODEL);
%>
// Array of max days in month in a year and in a leap year
function addUser()
{
if(validate())
{
document.forms[0].method = "POST";
document.forms[0].nextStep.value = "addUser";
document.forms[0].action = "User.do";
document.forms[0].submit();
}
}
function updateUser()
{
if(validate())
{
document.forms[0].method = "POST";
document.forms[0].nextStep.value = "updateUser";
document.forms[0].action = "User.do";
document.forms[0].submit();
}
}
function ClearOptions(OptionList)
{
for (x = OptionList.length; x >= 0; x = x - 1)
{
OptionList[x] = null;
}
}
function AddToOptionList(OptionList, OptionValue, OptionText)
{
OptionList[OptionList.length] = new Option(OptionText, OptionValue);
}
}
function getSecretQuestion()
{
var questionId=document.forms[0].secretQuestion.value;
if(questionId== "")
{
alert("Select Secret question");
}
else
{
$ajax({
type: "get",
url: "Register.do",
error: function(data){alert("Error");}
});
}
}
function finish()
{
var countryId = document.forms[0].country.value;
if(countryId == "")
{
alert("Please select country.");
}
else
{
$.ajax({
type: "get",
url: "Register.do",
data: "nextStep=getStateListByCountry&country="+countryId,
error: function(data) {alert("Error");},
success: function(response)
{
var stateList = document.forms[0].state;
ClearOptions(stateList);
AddToOptionList(stateList,"","Select State");
$.each($(response).find("state"), function(i, state)
{
var stateId = $(state).children("stateId").text();
var stateName = $(state).children("stateName").text();
AddToOptionList(stateList,stateId,stateName);
});
}
});
}
}
</script>
<%
ArrayList<City> cityList =(ArrayList<City>)request.getAttribute("CITY_LIST");
ArrayList<Country> countryList =(ArrayList<Country>)request.getAttribute("COUNTRY_LIST");
ArrayList<State> stateList =(ArrayList<State>)request.getAttribute("STATE_LIST");
%>
<div> </div>
<input type="hidden" name="<%=org.apache.struts.taglib.html.Constants.TOKEN_KEY %>" value="<bean:write name="<%=Globals.TRANSACTION_TOKEN_KEY%>"/>" />
<div style="float: left;">
<logic:notEmpty name="UPDATE_USER">
<a href="User.do?nextStep=userHome">Back</a>
</logic:notEmpty>
</div>
<div style="width: 700px; margin-left: 100px;" class="border">
<table class="back_img" cellspacing="5" width="100%" height="600">
<tr valign="top">
<td height="10"><h3><u>User Registration</u></h3></td>
</tr>
<tr valign="top">
<td>
<table>
<tr>
<td> </td>
</tr>
<!--<tr>
<td><b>Name:</b> </td>
<td><input type="text" name="firstName" class="textfield"/> <input type="text" name="middleName" class="textfield"/> <input type="text" name="lastName" class="textfield"/></td>
</tr>
<tr>
<td width="200"> </td>
<td> First Name Middle Name Last Name</td>
</tr>-->
<tr>
<td><span style="color:red;font-size:small;visibility: true">*</span><b>Gender:</b></td>
<td><html:radio property="gender" name="UserForm" value="<%=ApplicationConstant.GENDER_MALE %>" tabindex="1"/>Male <html:radio property="gender" name="UserForm" value="<%=ApplicationConstant.GENDER_FEMALE %>" tabindex="2"/>Female <span style="color:red;font-size:small;visibility: true">*</span>
<b>Birth Date: </b>
<input type="text" name="dateOfBirth" readonly="readonly" value="<bean:write property="dateOfBirth" name="UserForm"/>" ><a href="#" onClick="setYears(1900, 2013); showCalender(this, 'dateOfBirth');" > <img src="images/calendar.gif"></a>
<span style="color:red;font-size:small;visibility: true">*</span><b>Age: </b>
<!-- <input type="text" id='idAge' name="age" class="textfield4" ondblclick="closeCalender();calcAge();" tabindex="4" maxlength="3"></input>-->
<input type="text" id='idAge' name="age" class="textfield4" onclick="pickDate(month,day,year);" tabindex="4" maxlength="3"></input>
</td>
</tr>
<tr>
<td><span style="color:red;font-size:small;visibility: true">*</span><b>Password:</b></td>
<td><html:password name="UserForm" property="userPassword" styleClass="textfield"/></td>
</tr>
<tr>
<td><span style="color:red;font-size:small;visibility: true">*</span><b>Confirm Password:</b> </td>
<td><input type="password" name="confirmPassword" class="textfield" value="<bean:write name="UserForm" property="userPassword"/>"/></td>
</tr>
<tr>
<td><span style="color:red;font-size:small;visibility: true">*</span><b>Secret Question:</b> </td>
<td><select name="secretQuestion" class="selectfield" style="width:220px;">
<option value="">Select secret Question?</option>
<%
HashMap<String, String> qHash = CommanUtility.getQuestion();
if(session.getAttribute(ApplicationConstant.UDHC_USER_MODEL) != null)
{
//User user = (User)session.getAttribute(ApplicationConstant.UDHC_USER_MODEL);
if(user != null)
{
for(int i = 1; i <= qHash.size(); i++)
{
if((i+"").equals(user.getSecretQuestion()))
{
%>
<option value="<%=i %>" selected="selected"><%=qHash.get(i+"") %></option>
<%
}
else
{
if(qHash.get(i+"") != null)
{
%>
<option value="<%=i %>"><%=qHash.get(i+"") %></option>
<%
}
}
}
}
}
else
{
for(int i = 1; i <= qHash.size(); i++)
{
if(qHash.get(i+"") != null)
{
%>
<option value="<%=i %>"><%=qHash.get(i+"") %></option>
<%
}
}
}
%>
</select>
</td>
</tr>
<tr>
<td><span style="color:red;font-size:small;visibility: true">*</span><b>Secret Answer:</b> </td>
<td><html:text property="secretAnswer" name="UserForm" styleClass="textfield"/></td>
</tr>
<tr>
<td><b>Contact details:</b> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>
<table>
<tr>
<td><span style="color:red;font-size:small;visibility: true">*</span>Address 1:</td>
<td><html:text property="address1" name="UserForm" styleClass="textfield1"/></td>
</tr>
<tr>
<td>Address 2:</td>
<td><html:text property="address2" name="UserForm" styleClass="textfield1"/></td>
</tr>
</table>
<table>
<tr>
<td><span style="color:red;font-size:small;visibility: true">*</span>Country: </td>
<td>
<html:select property="country" name="UserForm" styleClass="selectfield" onchange="javascript:getStateList();">
<html:option value="">Select Country</html:option>
<html:optionsCollection name="COUNTRY_LIST" value="countryId" label="name" />
</html:select>
</td>
</tr>
<tr>
<td><span style="color:red;font-size:small;visibility: true">*</span>State:</td>
<td>
<html:select property="state" name="UserForm" styleClass="selectfield" onchange="javascript:getCityList();">
<html:option value="">Select State</html:option>
<html:optionsCollection name="STATE_LIST" value="stateId" label="name" />
</html:select>
</td>
<td><span style="color:red;font-size:small;visibility: true">*</span>City: </td>
<td>
<html:select property="cityId" name="UserForm" styleClass="selectfield">
<html:option value="">Select City</html:option>
<html:optionsCollection name="CITY_LIST" value="cityId" label="name" />
</html:select>
</td>
<td>PIN:</td>
<td><html:text property="pinCode" name="UserForm" styleClass="textfield"/></td>
</tr>
<tr>
<td>Phone: </td>
<td><html:text property="phone" name="UserForm" styleClass="textfield"/></td><td><span style="color:red;font-size:small;visibility: true">*</span>Cell:</td><td><html:text property="cellNo" name="UserForm" styleClass="textfield"/></td>
</tr>
<tr>
<td><span style="color:red;font-size:small;visibility: true">*</span>Email: </td>
<td colspan="4"><html:text property="email" name="UserForm" styleClass="textfield1"/></td>
</tr>
</table>
</td>
</tr>
<tr>
<td valign="top"><b>Other Relevant Information:</b></td>
<td>
<table>
<tr>
<td>Height:</td>
<td><html:text property="height" name="UserForm" styleClass="textfield3"/><b>Cm.</b></td>
<td>Weight:</td>
<td><html:text property="weight" name="UserForm" styleClass="textfield3"/><b>Kg</b></td>
</tr>
<tr>
<td>Blood Pressu </td>
<td><html:text property="bPSystolic" name="UserForm" styleClass="textfield4"/> <html:text property="bPDiastolic" name="UserForm" styleClass="textfield4"/><b>mmHg</b></td>
<td>Pulse rate:</td>
<td><html:text property="pulseRate" name="UserForm" styleClass="textfield3"/></td>
</tr>
</table>
</td>
</tr>
<logic:empty name="UPDATE_USER">
<tr>
<td> </td>
<td align="char" colspan="2" rowspan="2"><a href="javascript:addUser();"><img src="images/Register1.png" border="0"></img></a> <a href="index.jsp"><img src="images/Cancel1.png" border="0"></img></a></td>
</tr>
</logic:empty>
<logic:notEmpty name="UPDATE_USER">
<tr>
<td> </td>
<td align="char"><a href="javascript:updateUser();"><img src="images/update.png" border="0"></img></a> <a href="User_Home.jsp"><img src="images/Cancel1.png" border="0"></img></a></td>
</tr>
</logic:notEmpty>
</table>
</td>
</tr>
<logic:messagesPresent message="true">
<tr>
<td colspan="2" align="center">
<html:messages id="message" message="true">
<div class="error">
<bean:write name="message"/>
</div>
</html:messages>
</td>
</tr>
</logic:messagesPresent>
</div>
</table>
<table id="calenderTable">
<tbody id="calenderTableHead">
<tr>
<td colspan="4" align="center">
<select onChange="showCalenderBody(
createCalender(document.getElementById('selectYear').value,
this.selectedIndex, false));"
id="selectMonth">
<option value="0">Jan</option>
<option value="1">Feb</option>
<option value="2">Mar</option>
<option value="3">Apr</option>
<option value="4">May</option>
<option value="5">Jun</option>
<option value="6">Jul</option>
<option value="7">Aug</option>
<option value="8">Sep</option>
<option value="9">Oct</option>
<option value="10">Nov</option>
<option value="11">Dec</option>
</select>
</td>
<td colspan="2" align="center">
<select onChange="showCalenderBody(createCalender(this.value,
document.getElementById('selectMonth').selectedIndex, false));"
id="selectYear">
</select>
</td>
<td align="center">
<a href="#" onClick="closeCalender();calcAge();">
<font color="#003333" size="+1">X</font>
</a>
</td>
</tr>
</tbody>
<tbody id="calenderTableDays">
<tr style="">
<td>Sun</td><td>Mon</td><td>Tue</td><td>Wed</td>
<td>Thu</td><td>Fri</td><td>Sat</td>
</tr>
</tbody>
<tbody id="calender"></tbody>
</table>
<jsp:include page="Footer.jsp"></jsp:include>
I have a question is it bad or what are the disadvantages of doing what I am going to explain. I want to put the same javascript file two time in the same page e-g Code: <script type="text/javascript" src="http://www.mydomain.com/javascript.js"></script> <script type="text/javascript" src="http://www.mydomain.com/javascript.js"></script> Now many people will ask why would I want to do that, well the reason is that I am using blogger and blogger doesn't let me see all code from which the page is made rather split it into two parts named as POSTS and EDIT HTML. So I am going to place this script in those both areas but at the end when the page loads it is actually going to two the same script two times which is not error. Another question would be why am I not using same script in one place rather than two places if at the end the page code is going to become one. Well the answer would be because that script is used by other scripts too so I CAN'T CHANGE THE LOCATION if I do so, then the script stops working. Hi There, Below is some very basic html/javascript that asks for a user to enter a number in an input text box and then a button is pressed it writes out a line that number of times. It works, but when run in firefox the pages always seems to continue to load... that is, the cursor is continuously that when a page is loading (an arrow with a little circle) and the status bar in the bottom right hand corner seems to be always be at zero. It seems to be something in the for loop as when this is take out it works. Seems to work in IE however? Any ideas? Is this a FireFox thing or am I not terminating the loop properly? Code: <html>
<head>
<script type="text/javascript" language="javascript">
<!--
function writeloop(){
var noTimes = document.theForm.theAmount.value;
for(x=0;x<=noTimes;x++){
document.write("A line!"+"<br />");
}
}
function cleantext(){
document.theForm.theAmount.value="";
}
//-->
</script>
<title>Write Loop</title>
</head>
<body>
<form name="theForm" action="#">
<input type=button value="Press me" onclick="writeloop();" />
<br /><br />
Enter the amount of times: 
<input type=text name="theAmount" value="blah" onfocus="cleantext()"/>
</form>
</body>
Many thanks! Hello, I don't know if this can be done in Javascript, or requires any other language but i was wondering if this would be possible. I would like to embed this Javascript code in to a PHP file and then for it to run automatically upon the PHP file loading: Code: <td class="smallDesc"> <a name="fb_share" type="button_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script> </td> The Javascirpt is the Facebook Share button that basically allows users that have Facebook to share the page there currently on in their Facebook status by pressing the button, but if there not logged in it shows the login page, not a problem just continue the script. The current button i which is what i want to load automatically in the PHP file is located here, to test the functionalilty just click "Share" button in blue.. http://watch-movies-online.anyfilman...-Movie-17.html To summarise, i would like the above Javascript code to execute automatically upon pageload of this PHP file.. http://www.watch-movies-online.anyfi...p://google.com. If that could be done, and if this also is possible.. i would like for the "Share" button on the external page that is loaded from the Javascript code above to be clicked automatically so in effect when ever someone visits the PHP page after clicking "Click Here to Watch/Stream 2012 Online For Free" on this page it will automatically load the Facebook Share box, and automatically click the "Share" Button and then close the page if possible, but not required. Please feel free to ask any questions, i'll be happy to answer. Thanks in advance. Best Regards, Jonathan. Hi all Is there a way to get the image(s) to load into the table after the page has loaded instead of the way I have it now? I have 4 tabs, but I would like the imgs in tabs 2,3,4 to load after page load. Example of how the tabs look. Code: <div class="tabbertab">
<h2>Australia_____</h2>
<table width="100%" border="0" cellpadding="3" cellspacing="1" bgcolor="#FFFFCC">
<caption class="highlight_Red">澳洲 Australia
</caption>
<tr>
<td><a href="pages/promotion.html#aus_ACE" rel="nofollow" target="_blank"><img src="pages/images/Pics/AUS/ace.jpg" alt="ACE / ATTC" width="110" height="69" border="0" align="left" class="ozimg_L"/> ...a few more images etc
the other tabs look the same. LT Hello , here is my code(which is not working on my problem) i want to remove anchor tag(href="a") will u please help.... Code: <html>
<head><title>Welcome to DevForum</title></head>
<script language="javascript" type="text/javascript">
function Remove()
{
var anchor = document.getElementsByTagName("a");
var i;
for(i=0;i<anchor.length;i++)
{
var anc=anchor.item(i);
var href=anc.attributes.getNamedItem("href");
if (href.value == "a")
{
anchor.item(i).attributes.getNamedItem("href").value = "";
}
}
}
</script>
<body onload="Remove()">
<h1>Welcome</h1>
<a href="b">b</a>
<a href="a">a</a>
</body>
</html>
Thanks in Advance.... This script displays a link to a registration/login form that loads in a light box for Joomla. I've been goin nuts trying to figure out how to get this to load on page load with a delay. Anyone know how to get this done? PHP Code: <?php JHTML::_('behavior.mootools'); $document = JFactory::getDocument(); $document->addStyleSheet(JURI::base() . 'media/system/css/modal.css'); $document->addScript(JURI::base() . 'media/system/js/modal.js'); $document->addScriptDeclaration("window.addEvent('domready', function() {SqueezeBox.initialize({});});"); $user = & JFactory::getUser(); $uri = JFactory::getURI(); $url = $uri->toString(); $return = base64_encode($url); ?> <div id="lbframeid" style="position:absolute;top:1px;left:1px;height:0px;width:0px;overflow:hidden"> <a href="http://www.wowjoomla.com/"><h1>Joomla Login LightBox powered by WowJoomla.com</h1> </a> </div> <?php if ($user->get('guest')) :?> <a href="<?php echo JRoute::_('index.php?option=com_loginbox')?>" onclick="SqueezeBox.fromElement(this); return false;" rel="{handler: 'iframe', size: {x: 660, y: 500}}"><?php echo JText::_('SIGNUP_LOGIN')?></a> <?php else: ?> <?php echo JText::sprintf( 'HINAME', $user->get('name') ); ?> <br> <a href="javascript:void(0);" onclick="LB_onLogout(); return false;"><?php echo JText::_('LOGOUT')?></a> <?php endif; ?> <script type="text/javascript"> function LB_onLogout() { var form = new Element('form'); form.setProperty('method', 'POST'); form.setProperty('target', '_self'); form.setProperty('action', 'index.php'); var input = new Element('input'); input.setProperty('type', 'hidden'); input.setProperty('name', 'option'); input.setProperty('value', 'com_user'); form.appendChild(input); var input = new Element('input'); input.setProperty('type', 'hidden'); input.setProperty('name', 'task'); input.setProperty('value', 'logout'); form.appendChild(input); var input = new Element('input'); input.setProperty('type', 'hidden'); input.setProperty('name', 'return'); input.setProperty('value', '<?php echo $return; ?>'); form.appendChild(input); $E('body').appendChild(form); form.submit(); } </script> Hello. My goal is to load the JS for a specific element before displaying that element. I integrated a third part script, and it works well. I set the timer he The JS is in my heading as <script type="text/javascript" src="countdownpro.js"></script> About mid-body I have: <span id="countdown1">2010-07-20 00:00:00 GMT+00:00</span> which allows for the setting of a target date to countdown to. When the page first loads it shows the above long format target time, until the js/meta tags kick in to modify it to just show the actual countdown as 00:00:00. I have attached countdownpro.js to this post. I tried shifting the function CD_Init() to the top of the script, and also appended it inline with the .html. I tried setting the big external script to "defer", but neither arrangement worked. I also tried placing the src file right at the top. I appreciate your help. in HTML you can call CSS Code: <head> <link rel="stylesheet" type="text/css" href="style.css" /> </head> <tr><td class="cssHere">Display</td></tr> can you even call CSS in javascript? Code: document.writeln("<tr><td class="cssHere">" + Display + "</td></tr>");
if so how do you even call the "style.css" thanks Hello, I am new to using Javascript and have some experience with HTML and CSS. I am trying to use Javascript to display an image based on a value. I have the image positions in my .css. Just to make it easy if my var x=0 i want to call the "position 1" div, or else i want to call the "position 2" div. How can i make this possible. I have positions because i have a background image and i want the different pictures to be in a different location on the background based on the value. Below is my code that I have right now. Thanks for the help. layout.css #layout { position: relative; top:0%; z-inderx:-1; } #date { position: absolute; top:5%; left: 50%; margin-left: -190px; z-index: 1; font-family: calibri; font-size: 44px; font-weight: bold; color:#000000; } #location1 { position: absolute; top:22%; left: 50%; margin-left: -590px; z-index: 1; } #location2 { position: absolute; top:28%; left: 50%; margin-left: -590px; z-index: 1; } Layout.HTML <html> <head> <Title>Layout</title> <link rel"stylesheet" type="text/css" href="layout.css" /> </head> <body> <div id="layout"> <center> <img border="0" src="background.png" width="1200" height="880" /> </center> </div> <div id="date"> 24 OCTOBER </div> <script type="text/javascript"> var x=0; if (x==0) { <div id="location1"> <img border="0" src="picture1.png" width="70" height="60" /> </div> } else { <div id="location2"> <img border="0" src="picture2.png" width="70" height="60" /> </div> } </script> </body> </html> Hi All, Im new to this forum...need some of your help and advice. I have a js code like this : <script type="text/javascript"> <!-- var sipPos = 0; $(document).ready(function() { $("#panel-tab").click(function(e) { //if(autoTimer) clearTimeout(autoTimer); //autoTimer = null; e.preventDefault(); $("#panel").animate({ left: sipPos }, 1764, 'linear', function() { if(sipPos == 0) { sipPos = -856; } else { sipPos = 0; } }); }); }); --> </script> what it does is that it hide and show a panel by slidint it to the left. But my client want that on page load the panel opens automatically for about 2-3 seconds just to let users know that its here. So ive written this : <script type="text/javascript"> <!-- var sipPos = 0; $(document).ready(function() { var autoTimer = null; autoTimer = setTimeout(function(){ $("#panel").animate({ left: sipPos }); autoTimer = setTimeout(function(){ $("#panel").animate({ left: sipPos = -856 }); }, 2000); },1000); $("#panel-tab").click(function(e) { //if(autoTimer) clearTimeout(autoTimer); //autoTimer = null; e.preventDefault(); $("#panel").animate({ left: sipPos }, 1764, 'linear', function() { if(sipPos == 0) { sipPos = -856; } else { sipPos = 0; } }); }); }); --> </script> But when the panel finished showing the button to open it again doesn't work...any help please..really urgent. thks //Sam hi i have a sliding vertical menu in my page in the left side and in the right side i have a text say for eg: Home. So when i click on home, i need the left side vertical menu to slide and open and the home in the left side should get highlighted. How do i do this in javascript ???? Pls help!!!! Hello all here is a more intelligent question. This one is just on an exercise I am doing. I have to call a function using parameter values. my main function is this Code: function showResults(race,name,party,votes) or just function showResults in the next lines below i have to call the function is this the right way Code:
<script type="text/javascript">
{
showResults=("race[0],name1,party1,votes1");
}
</script>
or should it be without the { and } like this? Code:
script type="text/javascript">
showResults=("race[0],name1,party1,votes1");
</script>
or is it like this Code: script type="text/javascript">
showResults(race[0],name1,party1,votes1);
</script>
Thanks all, what would be the proper method Thanks var macs = { getMacAddress : function() { document.macaddressapplet.setSep( "-" ); document.write( "Mac Address = " + document.macaddressapplet.getMacAddress() ); } how do i call this function and display out in the website? this doesn't seems working.. <script type="text/javascript"> document.write(mac.getMacAddress()); </script> Anyone help? I would like to add some javascript code that used for mobile browser detection to redirect page to another page. I would like to add it to content editor web part in sharepoint. I think I need to add it to the source editor. I got the following javascript code from a website. (function(a,b){if(/android|avantgo|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris| kindle|lge |maemo|midp|mmp|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|symbian|treo| up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1- 6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te| us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa| cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el (49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w| od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\- (20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( | \/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|e\-|e\/|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/| ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(di|rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50| p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok (6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po (ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/| sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl (45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg \-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk (40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)| wmlb|wonu|x700|xda(\-|2|g)|yas\-|your|zeto|zte\-/i.test(a.substr(0,4)))window.location=b}) (navigator.userAgent||navigator.vendor|| window.opera,'http://www.mycustomizedmobilepage.html'); {/script} I also learned that I need to add this line of code to the page: _spBodyOnLoadFunctionNames.push("functionName"); to call the javascript so that there is some kind of time delay to make the page upload to work correclty with the code. My question is: I see this javascript start with function(a,b), I did't see actually a function name, how can I call this function by using _spBodyOnLoadFunctionNames.push Thanks -------------------------------------------------------------------------------- I have 2 pages, If in test.php i include test2.php everything is working perfect, but if the page appear the script is not working. Can someone help me find a problem? test.php PHP Code: <head> <script> function Show_test2(){ var ajaxRequest; try{ ajaxRequest = new XMLHttpRequest(); } catch (e){ try{ ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try{ ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e){ alert("Your browser broke!"); return false; } } } var ot = document.getElementById('over_time').value; var queryString = "?ot=" + ot; ajaxRequest.open("GET", "test2.php" + queryString, true); ajaxRequest.send(null); ajaxRequest.onreadystatechange = function(){ if(ajaxRequest.readyState == 4){ var ajaxDisplay = document.getElementById('Show_test2'); ajaxDisplay.innerHTML = ajaxRequest.responseText; } } } </script> </head> <body> <?php //include ("test2.php"); $year = 2014; if(!empty($year)) { echo 'Over Time: '; echo ' <select name="over_time" id="over_time" onclick="Show_test2()"> <option value="1">0</option> <option value="2">1</option> <option value="3">2</option> <option value="4">3</option> <option value="5">4</option> <option value="6">5</option> </select> <br/>'; echo '<div id="Show_test2"></div>'; } ?> </body> test2.php PHP Code: <html> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script> $(function() { $('input[name^="player"]').keyup(function(event) { var player = $(this).attr("name").split('_'); player = player[1]; var player_sum = 0; $('.player_'+player).each(function(index, el) { var pt = parseInt($(el).val()); if(!isNaN(pt)) { player_sum += pt; } }); $('#sum_'+player).html(player_sum); }); }); </script> <body> <?php echo 'first half<br>'; for ($i=1;$i<4;$i++){ echo "gracz".$i.": <input type='text' class='player_".$i."' name='player_".$i."' size='1' maxlength='2'> "; } echo '<br><br>'; echo 'second half<br>'; for ($i=1;$i<4;$i++){ echo "gracz".$i.": <input type='text' class='player_".$i."' name='player_".$i."' size='1' maxlength='2'> "; } echo '<br><br>'; for ($i=1;$i<4;$i++){ echo "gracz".$i.": <span id='sum_".$i."'>0</span> "; } echo '<br><br>'; ?> </body> </html> Thanks I have to call the script below from my html page. How would I do that? Do I need to modify the script at all? Put in a function that returns the random title to the html page? New to javascript any help woudl be apreciated. html page that calls the script Code: <html> <head> <script type='text/javascript' src='titles.js'></script> <script> document.title = rantitle[ranNumber]; </script> </head> titles.js Code: <script type="text/javascript" language="javascript">
<!--//
if (parseInt(navigator.appVersion) >= 4) {
var num = 3;
var rantitle = new Array(num+1);
rantitle[1] = "Random Title1";
rantitle[2] = "Random Title1";
rantitle[3] = "Random Title1";
ranNumber = parseInt(num * Math.random() + 1);
document.title = rantitle[ranNumber];
}
//-->
</script>
Hi guys, I am trying to insert the following call into my page; Code: <script type="text/javascript" defer="true">
$('#query').autocomplete({
serviceUrl:'service/autocomplete.ashx',
minChars:1,
delimiter: /(,|;)\s*/, // regex or character
maxHeight:400,
width:250,
deferRequestBy: 0, //miliseconds
params: { country:'Yes' }, //aditional parameters
// local autosugest options:
lookup: ['January', 'February', 'March', 'April', 'May'] //local lookup values
});
</script>
It works fine in all browsers except ie(6,7,8) Code: Internet Explorer can not open website. Operation Aborted. I understand it is caused by the jquery autocomplete function loading before the page / DOM has fully loaded. I tried adding Defer="true" to the script however this doesn't seem to work. Could someone please tell me what i must add to the script so that it loads after the dom has fully loaded? Thanks guys George |
|||||||