i have a script, after finishing something, a button with an link will appear, before the button is not clickable. but i have a problem.
this is the code:
FB.ui(e, function(t) {
if (t["post_id"]) {
//your download content goes here
// Do something there
var secret_data = "<a href=\"http://TEST.com\">";
jQuery("#results").html(secret_data);
}
})
<div id="results"><img src="img/button.png"></a>
I thought that after finishing this action that the code would look like this:
<img src="img/button.png">
But it isn't..
So does someone have the answer ?
If you are trying to wrap an <a> around an existing image use wrap()
$('#results img').wrap('');
Using html() replaces everything in the target element with the new content
Your html for button should be a div with button image(not clickable) like
<div id="results"><img src="img/button.png"></a>
And Javascript code to add the active button should be like
var secret_data = '<img src="img/button.png">';
jQuery("#results").html(secret_data);
This should do the trick.
Related
I'm trying to automatically click a href link when the page loads.
<div class="loadmore" kind="rb">
تحميل المزيد...
</div>
The link is supposed to load more comments when you click it.
I tried this:
window.onload = function() {
autoloadmore()
};
function autoloadmore() {
var loadmoreClass = document.getElementsByClassName("loadmore")[0];
var loadmoreChild = loadmoreClass.getElementsByTagName("a");
if(loadmoreClass){
loadmoreChild[0].click();
}
}
but it doesn't seem to work. The problem seems to be with click(), because when I use other codes such as .style.color, they work.
I'm using Blogger by the way.
This's a sample blog:
http://blog-sample-001.blogspot.com/2018/09/title.html
(go to تحميل المزيد...)
ps: I can't change the div.
Assign some ID to تحميل المزيد... . For example, clickAfterPageLoad or whatever you want, and then try this...
$(document).ready(function() {
$("#clickAfterPageLoad").trigger('click');
});
or if you cant't change div, you can do like this:
$(document).ready(function() {
$(".loadmore a").trigger('click');
});
When the popup link is between the <script> tags it does not work.
if(data.userdata["money_back"] == 1){
chat_list += '<a data-popup-open="popup-90">Download</a>';
}
I am pushing the
When it is between the <body> tags it works fine
<body><a data-popup-open="popup-90">Download</a></body>
Does "data-popup-open" not work between <script> tags?
Here is a JSFiddle of basically what I'm trying to do:
http://www.jsfiddle.net/tkkpf9dp
Something like that?
var popup = '<a data-popup-open="popup-90">Download</a>';
document.body.innerHTML += popup;
I think the problem is with the event handling. The event that should open open the pop up window may not be triggering. This is because you are creating a dynamic DOM element. The event handling of dynamic elements works in a different way. If you are using jQuery you can need to use something like this
Just add a class 'popup' to the 'a' tag like this
<a class="popup" data-popup-open="popup-90">Download</a>
and in JavaScript
$('body').on('click','.popup',function() {
var popup = $(this).data('popup-open');
console.log(popup); // For this example you will get the output 'popup-90' in the console
// You can write the code to open the pop up here
});
I am trying to replace the content of a DIV once the button inside that DIV is clicked, (basically replacing the button, which retreives a PHP variable:
<div id="buttonholder">
Publish
</div>
I am trying to replace it with an unpublish button after a post is published (when the button above is clicked):
function publish(status){
document.getElementById("buttonholder").innerHTML = 'Unpublish';
}
It does not work however ... What am I doing wrong ?
Your code syntax is wrong. Use like below.
function publish(status){
document.getElementById("buttonholder").innerHTML = 'Unpublish';
}
Add a button id and then do:
$(function() {
$("#buttonId").click(function() {
$("#buttonHolder").html(" html to replace with ");
});
});
Also you can use the $("#buttonHolder").html(" html to replace with "); instruction in your onClick function as well.
I have multiple instances of
<div class="picOuterDiv">
<a href="examplepage.php?var=1" class="iframe" > page one </a>
</div>
<div class="picOuterDiv">
<a href="examplepage.php?var=2" class="iframe" > page two </a>
</div>
Now I am using jQuery colorbox plugin to create Lightbox's. The lightBox opens when i click the anchor element, The anchor element with the class iframe. It works fine till here, using
$(".iframe").colorbox({iframe:true, width:"646", height:"675"});
What I want is to open the colorbox when I click the parent div. I used the following code to trigger anchor element href when div was clicked, but apparently the href alone wasnt enough, the element clicked should have the class "iframe" . So its not working with this code.
$('.picOuterDiv').each(function(){
$(this).on('click', function(){
location.href = $(this).find('a').attr('href');
});
});
So can anybody help me on how I can make this work ? I hope the Problem is clear. Thank you in advance.
UPDATE: http://jsfiddle.net/VhkFN/3/
$('.picOuterDiv').click(function() {
window.location.href=$(this).find('a').attr('href');
});
There are a couple issues with your fiddle. First "var arr[]" is not correct. Second, the hyperlink doesn't have any onclick property, so triggering a click won't do much. You need to grab its href attribute instead.
Demo: http://jsfiddle.net/VhkFN/4/
This was what worked for me. As i said i was using jquery colorbox.
$(".picOuterDiv").click(function () {
var anchorHref = $(this).find('a').attr('href');
$(this).colorbox ({iframe:true, width:"646", height:"675", href: anchorHref});
});
In my main.html page I have a button. When that button is clicked, I need to get the content of another page.
The target page has five divs, I need to catch one div and display that div data in main.html page.
Use Javascript and JQuery. See http://docs.jquery.com/Manipulation or specifically http://docs.jquery.com/Ajax/load
To be precise use something like this:
$("#yourdiv").load("/yourpage.html #section");
jQuery can do this very elegantly:
<script type="text/javascript" src="/js/jquery/jquery-1.3.2.min.js"></script>
<script>
//only when the DOM has been loaded
$(document).ready(function() {
//bind to button id="myButton" click event
$('#myButton').click(function() {
//populate div id="myDiv" with specific div (div id="someDiv") from another page
$('#myDiv').load('/anotherPage.html #someDiv');
});
});
</script>
See jQuery Ajax/load
As long as the second page is on the same domain, you can use AJAX techniques. For example, using Prototype you could do something like this:
new Ajax.Request('http://url.of.second/page', {
method: 'get',
onSuccess: function(transport) {
//make a regular expression to grab the required HTML fragment
var re = /<div id="otherdiv">(.*)</div>/i;
//extract the fragment from transport.responseText
var found = transport.responseText.match(re);
//add the fragment to targetdiv on current page
$('targetdiv').innerHTML=found[1];
}
});
Jiri's answer is spot on.
http://docs.jquery.com/Ajax/load
is the exact jquery link.
Thanks Jiri...