I have a page with many section like below.
When I travel from this page to anothe-page-2.html, it is possible when user click back button (from the browser) return and jump to <a name="test 2"></a> ?
try this any of two types...
<html> <head> <script>
function goBack() {
window.history.back() }
</script> </head> <body>
<input type="button" value="Back" onclick="goBack()">
</body> </html>
back
Related
Hello im making an hcaptcha redirect page, it dosn't work can anybody help/fix me with this?
So after i do the Hcaptcha id does show "405 error", note that i entered correct site key, thanks! Also im using github.io sites
<html>
<head>
<title>hCaptcha Demo</title>
<script src="https://js.hcaptcha.com/1/api.js" async defer></script>
</head>
<script type="text/javascript">
if (hrecaptcha.getResponse() == "success") {
function Redirect() {
window.location.href = "https://www.youtube.com/";
}
Redirect()
setTimeout(Redirect, 1000);
} else alert("You can't proceed!");
</script>
<body>
<form action="" method="POST">
<div class="h-captcha" data-sitekey="my-sitekey"></div>
<br />
<input type="submit" value="Submit" />
</form>
</body>
</html>
Edit: I noticed about "hrecaptcha" and i edited it but it still wont work
I'm making a website settings page (I guess) where the user of the website can edit the page values that are seen on the public page of a website. (This is restricted to logged-in users only)
I have a form (shown below) that when clicked, executes AJAX and 'posts' the update content page.
I guess my question here is how can I change the code below so it changes which text body to take from based on the button pressed.
Even simpler, How can I make a page-wide click event that applies to all buttons, of which I can tell which button is pressed?
I know there is only 1 text field and 1 button below, but there are going to be more in the future, hence why I need this fuctionality.
My e.js file:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="css/admin.css">
<title>Manage the website</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#submitButton").click(function(){
$.ajax({
url: 'update',
type: 'POST',
data: {
toUpdate: 'homepage',
text: document.getElementById('textField').value // Select a text field based on the button
},
});
});
});
</script>
</head>
<header>
<!-- Put partial includes here -->
</header>
<div class="topPage">
<h1>Hello, <%= firstName %>!</h1>
<p1>
Find a value you would like to edit, then press send. The website can take up to 10 mins for the changes to apply. The changes will not change live.
</p1>
</div>
<div class="homepage">
<div class="information">
<h1>
Homepage variables
</h1>
<p1>
Variables for the 'homepage' page are displayed below. Changes can take up to 10 mins to apply globally.
</p1>
<hr>
</div>
<div class="form">
<label>
Change the 'body' of 'homepage'
</label>
<form action="nothing" method="post">
<input type="text" id="textField" name="text" value="<%= pageData.get('homepage').homeBody%>" required>
<button type="button" class="submit" id="submitButton">Submit Changes</button>
</form>
</div>
</div>
<script>
</script>
</html>
Thanks in advance!
You can do it like this:
$("button").on("click", function() {
console.log($(this).attr("id"));
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="this">
This
</button>
<button id="that">
That
</button>
select the input tags in the form and track the change event:
$("form :input").on("change", function(){
var $elm = $(this); // the button which is clicked
// do your ajax here
});
Using html, Create a webpage with the following properties:
Create two buttons- turnon and turnoff.
Use on.png and off.png such that
a) If a user clicks on the turnon button, the webpage should display on.png (picture of a lightbulb on).
b) If a user clicks on the turnoff button, the webpage should display off.png (picture of a lightbulb off)
<!DOCTYPE html>
<html>
<head>
<title>Lightbulb</title>
</head>
<body>
<div style="text-align: center">
<input type="button" value="turnon"
onclick= showimage(img src="on.png") >
<input type="button" value="turnoff"
onclick= showimage(img src="off.png")>
</div>
</body>
</html>
function showImage() {
document.getElementById('loadingImage').style.display = 'block';
}
function hideImage() {
document.getElementById('loadingImage').style.display = 'none';
}
<input type="button" value="TURN ON" onclick="showImage();" />
<input type="button" value="TURN OFF" onclick="hideImage();" />
<img id="loadingImage" src="https://i.stack.imgur.com/WQB7V.jpg?s=48&g=1" style="display:none" />
Live Working Example
Actually you need to read, using javascript functions
Javascript functions => https://www.w3schools.com/js/js_functions.asp
Set image source => https://www.w3schools.com/jsref/prop_img_src.asp
Here is a helping link, you could find on google
https://www.w3schools.com/js/tryit.asp?filename=tryjs_lightbulb
When i apply DOJO style to a button, DOJO styled button is displayed along with a small normal button, Can anyone help me with this. Below is the complete HTML code. Thanks in advance.
<html>
<head>
<style type="text/css">
#import "http://o.aolcdn.com/dojo/1.2.0/dijit/themes/tundra/tundra.css";
</style>
<script>
dojoConfig = {
async : true,
parseOnLoad : true
}
</script>
<script
src="http://ajax.googleapis.com/ajax/libs/dojo/1.9.2/dojo/dojo.js"
data-dojo-config="async: true"></script>
<script>
require([ "dojo/parser", "dijit/form/Button" ], function(parser) {
parser.parse();
});
</script>
</head>
<body class="tundra">
<button dojoType="dijit.form.Button" type="button" />
Greetings
</button>
</body>
I'm noticing two things here:
You're closing your button twice:
<button dojoType="dijit.form.Button" type="button" />
Greetings
</button>
Look at the end of the first line, you're ending your <button> using />, which means you're closing the button as well. Replace that by:
<button dojoType="dijit.form.Button" type="button">
Greetings
</button>
The second thing I noticed is that you're loading an old version of the Tundra theme. You're using Dojo 1.9.2, but you're using the Tundra theme of 1.2.0. Try to replace your stylesheet by:
http://ajax.googleapis.com/ajax/libs/dojo/1.9.2/dijit/themes/tundra/tundra.css
Can anybody help me how to enable a button based on a click event.
I need a scenario, where we have 2 buttons, Button1 and Button2(disabled by default).
Upon clicking on Button1, say after 10 seconds my Button2 should be enabled.
Where i am doing wrong in the below code? My Button2 is not enabled after i click on Button1. Can anybody help me.
Thanks in advance,
Uday
<html>
<Head>
<Title>Synchronization</Title>
</head>
<script>
function PleaseWait()
{
document.getElementsByName("SampleButton2").disabled=false;
}
</script>
<body>
<input type="button" name="SampleButton1" value="Button1" onclick="PleaseWait()">
<input type="button" name="SampleButton2" value="Button2" disabled>
</body>
</html>
You can do it with jQuery.
Inside $(document).ready() method, define a function PleaseWait(), where you can write the code to remove disabled attribute form your button.
Then when any user clicks on button1, trigger a function to call pleaseWait() function after a delay using setTimeout() method. I used 5 milliseconds for delay. You can increase or decrease it.
<!DOCTYPE html>
<html>
<head>
<title>DOM Level 0 Events Example</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
</head>
<body>
<input type="button" name="SampleButton1" value="Button1">
<input type="button" name="SampleButton2" value="Button2" disabled>
<script type="text/javascript">
$(document).ready(function(e){
function PleaseWait(){
$('input[value="Button2"]').removeAttr('disabled');
}
$('input[value="Button1"]').click(function(e) {
setTimeout(PleaseWait, 5000);
});
});
</script>
</body>
</html>
try this
document.getElementsByName("SampleButton2").removeAttr('disabled');
or you can use
$('SampleButton2').prop('disabled', false);