I am trying to have a link automatically click after x seconds for my website. However, my following code does not work:
<body alink="#84868a" onLoad="setTimeout('delayer()', 1000)">
<script type="text/javascript">
function delayer(){document.getElementById("myButtonId").click();}
</script>
<div class="navBtns mar9 s3">
<span></span>
<span></span>
</div>
</div>
</div>
I'm not great with JavaScript so if somebody could assist that would be great!
onLoad== need to have only one =
also click() is jQuery function, are you pre-loading it?
This is working example:
http://jsfiddle.net/mgc5mqfa/
If you console log your document.getElementById it should return null. Thats because the javascript hasn't seen the node in the dom yet. Put your script at the bottom of your page and see if that fixes it.
Related
I've got some pretty simple HTML, a photo and some text but I want to put a javascript element between them. This element is a countdown timer and can be inserted using external javascript.
I have a codepen with the HTML, inline css, and javascript here: https://codepen.io/thomaskwelker/pen/xjwQPj
<div class="kanye-wrapper">
<div class="kanye-photo">
<img src="https://vignette.wikia.nocookie.net/star-clan/images/9/90/Kanye.png">
</div>
<div class="kanye-timer">
<script src="js/kanye.js"></script>
</div>
<div class="kanye-link">
See why
</div>
</div>
I've done hours of Googling and trying things. Could some please tell me how I can get the javascript timer inside the "kanye-timer" div?
Instead of $(document.body).append($r.cvs);, try $('.kanye-timer').append($r.cvs);
This tells the JS to append the timer to the div, rather that just placing it at the end of the document
Your initialization code creates a canvas object that is never attached to any DOM document. The JavaScript snippet doesn't have to be included in line. But you can have a container where you want the canvas to be:
<div class="kanye-wrapper">
<div class="kanye-photo">
<img src="https://vignette.wikia.nocookie.net/star-clan/images/9/90/Kanye.png">
</div>
<div class="kanye-timer" id="timercontainer">
</div>
<div class="kanye-link">
See why
</div>
</div>
<script src="js/kanye.js"></script>
Now within your kanye.js, write something like this:
document.getElementById('timercontainer').appendChild($r.cvs);
Of course this is not portable code. Once you make it work you can externalize the container ID as a parameter.
In order to understand my question look at the following example code:
<div id="here">
<div id="object"></div>
</div>
<div id="there">
</div>
$('#object') works always!
document.getElementById("object") will work if I change the DOM structure before?
$('#there').append( $('#object') );
document.getElementById("object") // will work?
Yes, it will work.
For getElementById to return DOM of element there is only need and that is Element should be on document it dosen't matter where it is.
It will work. See this code.
jQuery is not a language, it is just a JavaScript plugin and it make use of available functions in JavaScript.
console.log($('#object')[0]);
console.log(document.getElementById("object"));
$('#there').append( $('#object') );
console.log(document.getElementById("object"));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<div id="here">
<div id="object"></div>
</div>
<div id="there">
</div>
I want to move my html content from one div into another BUT WITHOUT rendering it again!
When I use the jquery html() method it will be rendered fully again!
E.g.
<div id="1">
<script>console.log("test")</script>
</div>
<div id="2">
</div>
<script>
$('#2').html($('#1').html())
</script>
will cause:
test
test
what I want is:
test
You can try using a combination of jQuery's .appendTo() and .clone() methods.
<div id="1">
<script>console.log("test")</script>
</div>
<div id="2">
</div>
<script>
$('#1').children().clone().appendTo('#2');
</script>
Here's a JSFiddle to demonstrate. Take a look at the console, and you should see that "test" is only logged once. If you want to move the elements from #1 to #2 rather than copy them, you can just remove .clone() from the chain.
Hope this helps! Let me know if you have any questions.
<script>
$('#2').hide().html($('#1').html())
</script>
<div id="feesnav">
<div style="float: right;">
<button id="b2" class="adjustuserfees_button active" onclick="cusers(this)"/>
</
Say I want to click on button b2 using python selenium. Tried all sorts of xpath definition and it retunrs can't find the locator error
The following code does not work:
self.sel.fire_event("//div[#id='feesnav']//button[#id='b2']", 'click')
or self.sel.mouse_down("//div[#id='feesnav']//button[#id='b2']")
Any suggestions?
That is very simple I think the example detailed here, is what your looking for.
Here is summary of what is detailed there.
<html>
<head>
<script type="text/javascript">
function displayDate()
{
document.getElementById("demo").innerHTML=Date();
}
</script>
</head>
<body>
<h1>My First Web Page</h1>
<p id="demo"></p>
<button type="button" onclick="displayDate()">Display Date</button>
</body>
</html>
Goodluck.
Isn't there a click() method or you are saying it is not working for you? If you are going the javascript route you could try something like below
String myScript="var element= document.getElementById('b2');";
if(browser is not IE) //add some logic here
myScript=myScript+"var evObj = document.createEvent('MouseEvents');evObj.initEvent('click',true,true);element.dispatchEvent(evObj);";
else
myScript=myScript+"element.fireEvent('onclick');
selenium.getEval(myScript);
I still don't think you would need to go JS route. Selenium should be able to do the click for you. Are you sure there are no hidden duplicate elements? Also there is no sync issue with your code, like you are trying to click on the button before even the page is loaded etc?
I am a novice in jQuery, and am trying to create this page. In all browsers I tested, when I click the red button a coupon code appears, except for IE. Why does this happen? And how can I fix it?
I hate this browser, really...
Javascript:
$(".coupon_button").live('click', function (event) {
$(".coupon_button").remove().fadeOut('slow');
$(".coupon_main").after($("<div class='coupon_code'>code:newhgcoupon</div>").fadeIn());
//$(".coupon_main").after().fadeIn('slow').html("<div class='code'>code:newhgcoupon</div>");
});
HTML:
<div class="module">
<div class="coupon_title">Pay <span class="yellow">1 Cent</span> your First Month</div>
<div class="coupon_main">To help save you some time, we created a link that takes you directly to the easily missed area on the official Medifast site that lists all of their latest specials and discounts.</div>
<div class="coupon_button"><img src="button.png" /></div>
<div class="coupon_footer">Expiration: 11-30-2010</div>
</div>
Your script is not executing in IE. To fix it, just change the script type to text/javascript.
IE does not recognize the application/javascript type as being a script at all.
I think you're missing your document.ready function. Add this line right above the first line of your script:
$(document).ready(function() {