I am trying to copy the link of current page using ZeroClipboard and I don't know what to do further.
This is my code until now. How can I copy the link?
function copyLink() {
document.getElementById("copy").value += window.location.href;
var link = document.getElementById("copy").value;
var client = new ZeroClipboard();
client.setText(link);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/zeroclipboard/2.2.0/ZeroClipboard.Core.min.js"></script>
<html>
<head>
<title>Copy</title>
</head>
<body>
<div>
<button id="copyBtn" onclick="copyLink()">Copy link</button>
<textarea id="copy" style="display: none;"></textarea>
</div>
</body>
</html>
Thanks !
Related
So, I want the user to be able to add a new paragraph when he/she clicks the Add button. I can see it's working when I click the button but after that the page refreshes itself, and then the supposedly new paragraph disappears.
Here's the HTML code:
<!DOCTYPE html>
<html>
<head>
<title>Item Lister</title>
<link rel="stylesheet" type="text/css" href="default.css"\>
</head>
<body>
<h1>ITEM LIST</h1>
<div id="container">
<ol>
</ol>
</div>
</br>
<form>
<input id="txtbox" type="text" name="txt"/>
</br>
<button id="add_btn" type="submit" name="add"/>Add</button>
</form>
<script src="myScript.js"></script>
</body>
</html>
And here's its JS code:
add_btn.onclick = function(){
var msg;
msg = document.getElementById("txtbox").value;
var newListElement = document.createElement("li");
var liText = document.createTextNode(msg);
newListElement.appendChild(liText);
document.getElementById("container").getElementsByTagName('ol')[0].appendChild(newListElement);
};
How do I add the new element after clicking the button?
Thanks.
Remove type="submit"
Edit : Turns out that just removing the submit attribute is not enough.
It should be changed to : type="button" :
<button id="add_btn" type="button" name="add"/>Add</button>
You have in fact at least two options:
Remove type="submit" as Bulent Vural already mentioned
Or return false from your onClick handler
I am trying to open a popup by clicking on a button.
Please check my below code and tell me why it isn't working.
I am using getreponse popup
http://www.reussirlegmat.com/2499-2/
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
</head>
<body>
<button id="button" >Show it</button>
<script type="text/javascript" src="https://app.getresponse.com/view_webform_v2.js?u=BaAuE&webforms_id=7152504">{
"name": "myuniqueform2"
}
</script>
<script>
var myform = GRWF2.get('myuniqueform2'),
element = document.getElementById('button');
element.addEventListener("click", function(){
myform.show();
});
</script>
</body>
</html>
On your website, something has put <p>...</p> tags around every line of your script.
<p><script type="text/javascript" src="https://app.getresponse.com/view_webform_v2.js?u=BaAuE&webforms_id=7152504">{</p>
<p>"name": "myuniqueform2" </p>
<p>} </p>
<p></script> </p>
<p><script> </p>
<p>var myform = GRWF2.get('myuniqueform2'),</p>
<p>element = document.getElementById('button');</p>
<p>element.addEventListener("click", function(){ </p>
<p>myform.show(); </p>
<p>}); </p>
<p></script> </p>
<p></body></p>
<p></html></p>
Those are causing parse errors. Get rid of them.
I have no idea how you did this -- I suspect you edited the code with a word processor and then told it to export to HTML.
So currently I want to have my javascript in an attached JS file instead of using the 'OnClick' function attached to HTML objects. So far I've got:
<html>
<head>
</head>
<body>
<h1 id = '5' class = ''>6</h1>
<button id = '7' class = ''>8</button>
<script src = 'js/9.js'></script>
</body>
</html>
But unfortunately, I can't quite get the redirect going from clicking the button. It should have this source
document.getElementById('7').onclick = function () {
and then redirecting to a different page. Any tips on how I can improve this?
Please use strings as ID. I know you can now use numbers but it is not recommended
Use the load event handler
You MAY be submitting the page to itself when not giving the button a type so return false or preventDefault
what's with the spacing around = in the attributes? Not necessary nor recommended.
Like this
<html>
<head>
<script src="js/9.js"></script>
</head>
<body>
<h1 id="five" class="">6</h1>
<button id="seven" class="">8</button>
</body>
</html>
where js file has
window.onload=function() {
document.getElementById("seven").onclick = function () {
location.replace("page2.html"); // or just location="page2.html";
return false;
}
}
Using jQuery it would be
<html>
<head>
<script src="js/jquery.js"></script>
<script src="js/9.js"></script>
</head>
<body>
<h1 id="five" class="">6</h1>
<button id="seven" class="">8</button>
</body>
</html>
where js file has
$(function() {
$("#seven").on("click",function (e) {
e.preventDefault();
location.replace("page2.html"); // or just location="page2.html";
});
});
LASTLY you do not need script at all:
<form action="page2.html">
<button type="submit" id="seven" class="">8</button>
</form>
Guys Below is my Script but It is not working can anyone tell why???
Wanna check? Please use This Script at:- http://calcus.host56.com/make_your_own_link.htm
<html><head>
<title>Hello</title>
<style>
a {color:black;font-size:23;}
textarea {color:white;font-size:1;border:none;}
</style>
<script>
function select8()
{
document.getElementById("demo").select();
}
</script>
</head>
<body>
<script>
function myFunction()
{
var x;
var name=prompt("Please enter your Facebook username","");
if (name!=null)
{
x="https://www.facebook.com/dialog/apprequests?api_key=148768088503846&app_id=148768088503846&data=%7B%7B"+"category"+"%3A"+"virtue"+"%7D%7D&display=popup&filters"+"&frictionless=false&locale=en_US&message=Here+is+a+Virtue+for+you+Mihir+Gupta%21%21+By+Chirag+Jain&next=http%3A%2F%2Fvolcanoisland.brokenbulbstudios.com%2F%252Ff312818684%26relation%3Dopener%26transport%3Dpostmessage%26frame%3Df18dc1ab6%26result%3D%2522xxRESULTTOKENxx%2522"+"&sdk=joey&title=Send+your+friends+a+daily+gift&to="+name;document.getElementById("demo").innerHTML=x;
}
}
</script>
<button onclick="myFunction()" accesskey="v">Click Here to Make Your Own Virtue Link </button>
<br>
<textarea id="demo">Your Url Here</textarea>
<button onclick="select8()" accesskey="x">Entered username?? <br>Now Click here and press Ctrl + c to copy the link </button>
Try this jsfiddle. You must define myFunction() in the head section.
<html>
<head>
<title>Hello</title>
<style>
a {color:black;font-size:23;}
textarea {color:white;font-size:1;border:none;}
</style>
<script>
function myFunction()
{
var x;
var name=prompt("Please enter your Facebook username","");
if (name!=null)
{
x="https://www.facebook.com/dialog/apprequests?api_key=148768088503846&app_id=148768088503846&data=%7B%7B"+"category"+"%3A"+"virtue"+"%7D%7D&display=popup&filters"+"&frictionless=false&locale=en_US&message=Here+is+a+Virtue+for+you+Mihir+Gupta%21%21+By+Chirag+Jain&next=http%3A%2F%2Fvolcanoisland.brokenbulbstudios.com%2F%252Ff312818684%26relation%3Dopener%26transport%3Dpostmessage%26frame%3Df18dc1ab6%26result%3D%2522xxRESULTTOKENxx%2522"+"&sdk=joey&title=Send+your+friends+a+daily+gift&to="+name;document.getElementById("demo").innerHTML=x;
}
}
function select8()
{
document.getElementById("demo").select();
}
</script>
</head>
<body>
<button onclick="myFunction()" accesskey="v">Click Here to Make Your Own Virtue Link </button>
<br>
<textarea id="demo">Your Url Here</textarea>
<button onclick="select8()" accesskey="x"> Entered username?? <br />Now Click here and press Ctrl + c to copy the link </button>
</body>
</html>
I just started learning JavaScript and am wondering why this simple snippet hangs when I click on the "Call function" button. What am I missing?
<html>
<head>
<script type="text/javascript">
function myfunction()
{
document.write("hello");
}
</script>
</head>
<body>
<form>
<input type="button"
onclick="myfunction()"
value="Call function">
</form>
</body>
</html>
You need to write inside an element or give an element a value, or you should use document write like that :
<html>
<head>
<script type="text/javascript">
function myfunction()
{
document.getElementById("lblMessage").innerText = "hello";
document.getElementById("txtMessage").value = "hello";
//document.write("hello");
}
</script>
</head>
<body>
<form>
<script type="text/javascript">
document.write("This is written while page processed by browser !<br />");
</script>
<input type="text" id="txtMessage" /><br />
<span id="lblMessage"></span><br />
<input type="button"
onclick="myfunction()"
value="Call function">
</form>
</body>
</html>
If you simply want to see your button doing something then try:
alert("Hello");
instead of the document.write.
Where do you expect the function to output its "hello"? Right into the button's source code? That makes no sense. The browser is confused and hangs.
Document.write doesn't magically insert something at the end of your document. It writes its stuff out right there where it is called.
Not too sure what you mean by "hang"... Try this out... The alerts can be removed, but will inform you of where it is at in execution...
<html>
<head>
<script type="text/javascript">
function myFunction() {
//for debugging
alert('Made it into function');
document.getElementById('MyOutputDiv').innerHTML = 'Word To Your Mom...';
//for debugging
alert('function complete');
}
</script>
</head>
<body>
<input type='button' onclick='myFunction();' value='Call Function'>
<br>
<div id='MyOutputDiv'></div>
</body>
</html>
document.write, but where? You have to specify this.
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Hello</title>
</head>
<body>
<pre><script type="text/javascript">
function myfunction() {
d = document.getElementById('hello');
d.style.display = "block";
d = document.getElementById('callme');
d.style.display = "none";
}
</script>
</pre>
<div id="hello" style="display:none">
Hello
</div>
<div id="callme">
<input type="button"
onclick="myfunction()"
value="Call function">
</input>
</div>
</body>
</html>
I can't explain the "hang" but please take a look at this page for a primer on document.write: http://javascript.about.com/library/blwrite.htm I would also like to second that you probably want to write to a specific element in the page rather than just overwriting the entire page.