Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 6 years ago.
Improve this question
is there any way to put two submit button at same position?Since I have submit button with hidden attribute based on dropdown,it will show up desirable button upon selection.
Are you trying to achieve something like this?
The main thing you need to look at, is that each button is positioned absolutely and has the same left and right.
var button1El = document.getElementById("button1");
var button2El = document.getElementById("button2");
button1El.addEventListener("click",function() {
this.style.display="none";
button2El.style.display = "block";
})
button2El.addEventListener("click",function() {
this.style.display="none";
button1El.style.display = "block";
})
button{
position:absolute;
left:10px;
top:10px;
}
#button2{
display:none;
}
<button id="button1">Button 1</button>
<button id="button2">Button 2</button>
Related
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 4 days ago.
Improve this question
I'm Having difficulties creating a slider with 3 different images.
I have a problem selecting the previous image when clicking on previous button in the slider.
Here is my javascript code
let images=['dice-1.png','dice-2.png','dice-3.png'];
var i =0;
function slideShow() {
document.getElementById("image").src=images[i];
if(i<images.length-1){
i++;
}
else {
i=0;
}
}
function prevSlide(){
document.getElementById("image").src=images[i];
if(i>images.length-1){
i--;
}
}
document.querySelector('.nxt').addEventListener('click', slideShow);
document.querySelector('.pr').addEventListener('click', prevSlide);
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 5 years ago.
Improve this question
I want to make a list in HTML and then the user selects the list and then do something with the selections.
For example. List of fruits. Apple bannana, grapes.
User selects grapes and if grapes is selected asked how many grapes?
I would like to know how i can do this in Javascript or Jquery
Use this code block. As simple as that,
//generates the list
var items = 'Apple, bannana, grapes';
var nHtml = '';
items = items.split(',');
items.forEach(function(v){
//trim() will remove the blank spaces
nHtml+='<li>'+ v.trim() +'</li>';
});
$('#itemList').append('<ul>'+ nHtml +'</ul>');
//detect click on the list item
$('li').click(function(){
var name = $(this).text();
var question = 'How many '+name+' ?';
$('#question').html('<span>'+ question +'</span><input type="text" id="answer" />')
});
//get the number feed into the text box
function getCount(){
var answer = $('#answer').val();
console.log(answer);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='itemList'></div>
<div id='question'></div>
<button onclick='getCount()'>Get Count</button>
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 6 years ago.
Improve this question
I used this function for checking the url
<script type="text/javascript">
$(document).ready(function () {
if (window.location.href.indexOf("franky") > -1) {
/* some code to change the css */;
}
});
</script>
Currently it only works when I refresh the page.
Is there a way to make it work when url change without any refresh ? Thanks
EXAMPLE : its like you have to choose a color , you click on a button to select your color , it make example.com/color.html#/red ; example.com/color.html#/blue ; example.com/color.html#/black only the color change with no refresh and i want to add specific css when url contain each string color
black
blue
<script type="text/javascript">
$(window).on('hashchange', function(e){
var origEvent = e.originalEvent;
resultdata = origEvent.newURL;
var black = resultdata.match(/black/);
if (black){
console.log(black);
}
});
</script>
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 6 years ago.
Improve this question
I would like to make a button which I can put on "true/false" on a certain time with javascript. I want to make a flickering button. How could I do this in Javascript?
I tried something like this:
<td colspan="1" class="button" tabindex="1">
<input type="radio" tabindex="-1">
</td>
__
setTimeout(function() {
$("*[tabindex='1']").find('input').get(0).checked = true;
http://www.w3schools.com/html/tryit.asp?filename=tryhtml_form_radio
(This button)
This checks/unchecks the button randomly and you can certainly change the logic behind when the button should be on vs. off, but it shows how to check and uncheck the radio button natively (no JQuery) with the addition or removal of the checked attribute on the Radio Button.
var btn = document.getElementById("rad");
setInterval(function(){
var rnd = Math.random();
console.log(rnd);
rnd > .5 ? btn.setAttribute("checked", "checked") : btn.removeAttribute("checked");
}, 500);
<input id="rad" type="radio">
Your code will work if you put the <td> element inside <table> tags.
If the <td> is outside of a table element, it is removed so you cannot access the radio button by searching for the parent td.
To make the button flicker, try having the function reset itself:
function buttonOnAfterDelay()
{
var $radioButton = $("*[tabindex='1']").find('input').get(0);
if ($radioButton.checked)
$radioButton.checked = false;
else $radioButton.checked = true;
setTimeout(function() {buttonOnAfterDelay()}, 1000);
}
buttonOnAfterDelay();
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 7 years ago.
Improve this question
$(document).ready(function(){
$("#sakla").click(function(){
$(".askforum").hide();
});
$("#getir").click(function(){
$(".askforum").show();
});
Hi ! how can I combine two button function to one button ? I want to run two functions with one button. the button name should change when I clicked if its show it must be become hide. thanks
Use toggle to toggle between shown and hidden. Change the two buttons into one button, and bind the click event to that button alone.
$(document).ready(function(){
var button = $('#thatnewbutton');
button.click(function(){
var forum = $(".askforum");
forum.toggle();
button.text(forum.is(':visible')?'Hide':'Show');
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="thatnewbutton">Hide</button>
<div class='askforum'>Content</div>
Here is a simple demo:
$(function() {
$('.toggle').on('click', function() {
var txt = $(this).text().trim();
$(this).text( txt == 'HIDE' ? 'SHOW' : 'HIDE' );
$('.whattotoggle').toggle();
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button class="toggle">HIDE</button>
<div class="whattotoggle">Toggle This</div>
$(document).ready(function(){
$("#thatnewbutton").click(function(){
$(".askforum").toggle();
});
});
Alternatively for changing the name, find attr name of the button and accordingly change it using attr function.
How can I set the Name attribute of an input field using Jquery?
Cheers!