On my website i have a button which when clicked takes you to one of two random youtube videos. However i would like to change this to a image in stead of a button.I have tried to change it to a INPUT type="image" but this doesn't work. Here is the code i am using.
<SCRIPT language="JavaScript">
<!--
function get_random()
{
var ranNum= Math.floor(Math.random()*2);
return ranNum;
}
function getaGame()
{
var whichGame=get_random();
var game=new Array(2)
game[0]= "https://www.youtube.com/watch?feature=player_detailpage&v=NcFQF3PZFRk#t=722s";
game[1]= "https://www.youtube.com/watch?v=klBAW4MQffU";
location.href = game[whichGame];
}
//-->
</SCRIPT>
<FORM name="form1">
<center>
<INPUT type="button" onClick="getaGame()" >
</center>
</FORM>
Thanks for any help
An onclick event can be fired from any element. Here are some examples!
Related
My kendo template is as follows:
<div id="file-err-msg" > Please remove files with errors</div>
<input name="files" id="files" type="file" />
<script id="fileTemplate" type="text/x-kendo-template">
<span class='k-progress'>
</span>
<strong class='k-upload-status'>
<button type='button' class='btn-remove k-button k-button-bare k-upload-action'>
<span class='k-icon k-i-close k-delete' title='Remove'></span>
</button>
</strong>
</script>
<script>
$("#files").kendoUpload({
template: kendo.template($('#fileTemplate').html())
});
</script>
I need to hide the div with id - file-err-msg, when the remove button is clicked. the Remove action is happening when the span with css class "k-delete" is clicked. I need to add the below event handler in addition, and it is never being called.
$(".k-delete").click(function () {
alert("Remove button clicked");
});
since these controls are rendered dynamically, i tried to bind them to the event handler as below, but nothing works.
$("body").on("click", ".btn-remove", function () {
alert("dynamic control event handler");
});
Any help is appreciated!
According to Kendo Upload API documentation, you can bind a function to the remove event.
So this is where you could hide your file-err-msg div :
$("#files").kendoUpload({
template: kendo.template($('#fileTemplate').html()),
remove: function(e) {
$('#file-err-msg').hide();
}
});
in my website, I have a singn_up-form and use the Google-Api to give the user some suggestions. The API requests the location of the user once in Internet-Explorer. But if I try Firefox, the requests are looped until I click "Standort immer Freigeben" - it means "always accept".
function initialize() {
autocomplete = new google.maps.places.Autocomplete(
(document.getElementById('autocomplete')),
{ types: ['geocode'] });
}
The code is loaded at document.ready and contains more code, but this snippet also reproduces the error.
Does anyone has some ideas?
Try this :
put the apis in your <head></head>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3&sensor=false&libraries=places"></script>
put this in your body tag:
<label for="autocomplete">Please Insert an address:</label>
<br>
<input id="autocomplete" type="text" size="100">
put this in your onload function:
var input = document.getElementById('autocomplete');
new google.maps.places.Autocomplete(input);
this is my code :
var input = document.getElementById('autocomplete');
new google.maps.places.Autocomplete(input);
<html>
<head>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3&sensor=false&libraries=places"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>
<label for="autocomplete">Please Insert an address:</label><br>
<input id="autocomplete" type="text" size="100">
</body>
</html>
You might have kept some onfocus attribute as given in Google Maps API Example
<input id="autocomplete" placeholder="Enter your address" onFocus="geolocate()" type="text"></input>
OR
If you don't require keeping bounds for places suggestions, you may want to remove it
OR
If you need to set bounds for suggestions keep some condition to not call location consent every time, if user gives permission.
Please keep your condition in geolocate() function
Issue is happening only in Mozilla FireFox
What you want to do is this:
function handlePermission() {
navigator.permissions.query({name:'geolocation'}).then(function(result) {
if (result.state == 'granted') {
geoBtn.style.display = 'none';
} else if (result.state == 'prompt') {
geoBtn.style.display = 'none';
navigator.geolocation.getCurrentPosition(revealPosition,positionDenied,geoSettings);
} else if (result.state == 'denied') {
geoBtn.style.display = 'inline';
}
});
}
then put handlePermission(); after your callback function receives permission
i am a newbie programmer.I am stuck for two days with a simple code.I try to use jquery form plugin for submitting a form to another page and get a feedback from that page.The problem is the plugin is not working.the form is submitted as normaly without feedback.Here is the code
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script>
<script src="http://malsup.github.com/jquery.form.js"></script>
<div id='preview'></div>
<form action='ajaxcall.php' id='upload_pic' enctype='multipart/form-data' method='post'>
<input type='file' id='pic' name='picture'>
<input type='submit' id='sub'>
</form>
var options=
{
target:'#preview',
url:'ajaxcall.php'
};
$(document).ready(function(){
$("#sub").click(function(){
$('#preview').html("<img src='images/loader.gif' alt='Loading.....'/>");
$('#upload_pic').ajaxForm(options).submit();
});
});
Here is my ajaxcall.php page code
if(!empty($_FILES['picture']['size']))
{
echo "<img src='images/197.jpg'>";
}
Expectation was the echoed image would feddback but the page is simply redirected to ajaxcall.php page.ajaxForm() function is not working.But why?please help.Thanks in advance.
Just replace your submit button for a normal one, because you are already submiting the form programatically from your click handler, so replace your following html:
<input type='submit' id='sub'>
for this one:
<input type='button' id='sub'>
use these codes instead of your script codes. sorry for the late answer
$(document).ready(function(){
$("#sub").click(function(){
var options=
{
target:'#preview',
url:'ajaxcall.php'
};
$('#preview').html("<img src='images/loader.gif' alt='Loading.....'/>");
$('#upload_pic').ajaxForm(options).submit();
});
});
The code for example document.getElementById("id").value="value"; is not working. I have assigned it on a function to replace the current value of the textbox once the page is loaded.
here is my code
<script type="text/javascript">
function rplace(){
document.getElementById('idtext').value="New Value";
}
onload=rplace
</script>
<form>
<input type="text" id="idtext" name="idtext" value="">
</form>
use jquery insteat of javascript.
$(document).ready(function(){ $("#idtext").val("New Value")});
Refer this
I`m newbie in jquery.
Got the following code:
`` `
How do I validate the textbox for user input required on clicking the button save and display error message next to the save button?
There appears to be a Validation Plug-In for jQuery. Have you looked at this already?
If not, it appears to do exactly what you want, and there is plenty of documentation right there to get started.
You can try something like
<html>
<head>
<script type="text/javascript">
function Test(txtCheck, lblCheck)
{
if (txtCheck.value == "")
lblCheck.innerHTML = "Textbox is empty";
else
lblCheck.innerHTML = "";
}
</script>
</head>
<body>
<input type="text" id="txtCheck" />
<input type="button" value="Save" onclick="Test(txtCheck, lblCheck);"/>
<label id="lblCheck"/>
</body>