Jquery selector > can't select autofocus attribute [closed] - javascript

Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 6 years ago.
Improve this question
I want to select elements that have an autofocus attribute present. For some reason, my jquery selector $("[autofocus]") isn't returning anything.
I imagine this is a simple solution, I just can't see what I'm doing wrong (is it a bug?!).
Browser: Chrome - Version 52.0.2743.116 m (64-bit)
HTML :
<input id="a" type="text" autofocus="autofocus" value="a" />
<input id="b" type="text" autofocus="autofocus" value="b" />
<input id="c" type="text" autofocus="autofocus" value="c" />
Javascript :
console.log($("[type=text]").length); // -> 3
console.log($("[autofocus]").length); // -> 0
console.log($("[autofocus=autofocus]").length); // -> 0
Why can't I select the autofocus attribute?
JSBin

Working fiddle
Your code works just fine as you could see in the example below. the bug come from the JsBin that translate the autofocus="autofocus" to ="autofocus".
Hope this helps.
var focusFn = function(){
console.log("inside fn");
console.log($("[type=text]").length);
console.log($("[autofocus]").length);
console.log($("[autofocus=autofocus]").length);
$("input[type=text]:visible:first").focus();
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="button" value="focus" onclick="focusFn()"></input><br/>
<input id="a" type="text" autofocus="autofocus" value="a" /><br/>
<input id="b" type="text" autofocus="autofocus" value="b" /><br/>
<input id="c" type="text" autofocus="autofocus" value="c" /><br/>

Related

Why isn't my text changing color? (Javascript) [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Closed 6 years ago.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Improve this question
Trying to change the color of the text with javascript - here is what I have
<input name="text" value="black" id="black" type="radio" onclick="changetextcolor(this);">"Black"
<input name="text" value="purple" id="purple" type="radio" onclick="changetextcolor(this);">"Purple"
<input name="text" value="lightpink" id="lightpink" type="radio" onclick="changetextcolor(this);">"Light Pink"
function changetextcolor(element){
document.body.style.Color = element.value;
};
here is the web page I am working on http://www.acsu.buffalo.edu/~mariaroo/validation.html
You have to put color property in lowercase and not with capital letters.
color and not Color.
function changetextcolor(element){
console.log(element.value);
document.body.style.color = element.value;
};
<input name="text" value="black" id="black" type="radio" onclick="changetextcolor(this);">Black
<input name="text" value="Purple" id="purple" type="radio" onclick="changetextcolor(this);">Purple
<input name="text" value="lightpink" id="lightpink" type="radio" onclick="changetextcolor(this);">Light Pink
You're changing the wrong property in your code. It should be document.body.style.color (note all lowercase color).
You mixed something up.
You can not use a .text property for styling the color of your text.
Try .color instead. This should work.
function changetextcolor(element){
document.body.style.color = element.value;
};

Checking groups of checkboxes in javascript [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking us to recommend or find a tool, library or favorite off-site resource are off-topic for Stack Overflow as they tend to attract opinionated answers and spam. Instead, describe the problem and what has been done so far to solve it.
Closed 8 years ago.
Improve this question
I am looking for a javascript that can check multiple checkboxes within a set group.
I am searching for something that would achieve this:
If checkbox group1 is checked checkbox 1,2,3,4,5 are checked.
I did not find a similar solution in Javascript please help me out!
here is a solution :
HTML :*
<input type="checkbox" onchange="check('1');" name="GRP" id="GRP1" />G1
<br>
<input type="checkbox" name="GRP-1" />1-G1
<input type="checkbox" name="GRP-1" />2-G1
<input type="checkbox" name="GRP-1" />3-G1
<input type="checkbox" name="GRP-1" />4-G1
<hr>
<input type="checkbox" onchange="check('2');" name="GRP" id="GRP2" />G2
<br>
<input type="checkbox" name="GRP-2" />1-G2
<input type="checkbox" name="GRP-2" />2-G2
<input type="checkbox" name="GRP-2" />3-G2
<input type="checkbox" name="GRP-2" />4-G2
<hr>
<input type="checkbox" onchange="check('3');" name="GRP" id="GRP3" />G3
<br>
<input type="checkbox" name="GRP-3" />1-G3
<input type="checkbox" name="GRP-3" />2-G3
<input type="checkbox" name="GRP-3" />3-G3
<input type="checkbox" name="GRP-3" />4-G3
JavaScript :
function check(grp_num)
{
var checks=document.getElementsByName('GRP-'+grp_num);
for(i=0;i<checks.length;i++){
checks[i].checked=document.getElementById("GRP"+grp_num).checked;
}
}

Populate hidden text input using jQuery [closed]

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 9 years ago.
Improve this question
<input name="input1" id="input1" type="text" value="" class="problem">
<input name="input2" id="input2" type="text" value="" class="hidden">
I'm trying to populate a hidden text input (e.g. input#input2) field with the current value from another text input field (e.g. input#input1) (un-submitted) using jQuery. I've sourced this jsfiddle doing exactly what i require but with a drop down field. And i was wondering if anyone is able to point me in the right direction?
EDIT: Sorry if i wasn't clear, the jsfiddle works perfectly but i'm trying to use a text field instead of a drop down to populate the other field.
i always handle this by storing that value in a variable:
var yourText = document.getElementById("input1").value;
and then just plug it into the hidden field:
$('#input2').val(yourtext);
here's your hidden field:
<input id="input2" type="hidden" />
$("#my_form").submit(function(event){
var visibleInputVal = $("#input1").val();
if(visibleInputVal != ""){
$("#input2").val(visibleInputVal);
}else{
alert("you need to provide a value for input 1");
event.preventDefault();
}
});
<form id="my_form">
<input type="text" value="" id="input1" />
<input type="hidden" value="" id="input2" />
<input type="submit" value="Submit" />
</form>

How would the next slider work? [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Closed 9 years ago.
Improve this question
Ok,
This is the code I'm using :-
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
$(function() {
$("#rangePoints").change(function() {
var qty = $("#rangePoints").val();
var price = $("#price").val();
$("#qty").val(qty);
$("#total").val(qty*price);
});
});
</script>
</head>
<body>
Price: <input id="price" type="text" value="10.50" readonly /><br/>
Quantity: <input id="qty" type="text" value="1" readonly />
<input id="rangePoints" type="range" min="1" max="100" value="1"/><br/><br/>
Total Price: <input type="text" id="total" readonly />
Price: <input id="price" type="text" value="15.50" readonly /><br/>
Quantity: <input id="qty" type="text" value="1" readonly />
<input id="rangePoints" type="range" min="1" max="100" value="1"/><br/><br/>
Total Price: <input type="text" id="total" readonly />
</body>
</html>
(Thanks to charles360 for helping with this javascript).
In the code above, only the first slider works (which has the price 10.50)...where as..the second one doesn't works.
I need to have multiple of these sliders and each slider has to perform the quantity * price function.
How would I make this happen ?
Thanks.
You've got different elements that have the same id. ids should be unique on the page. It'll only look up the first id since they're supposed to be used only once.
If you want something that can be re-used multiple times on a page, use classes and $(".className") instead of $("#idName")

Wiping out default text when user will enter a username [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions concerning problems with code you've written must describe the specific problem — and include valid code to reproduce it — in the question itself. See SSCCE.org for guidance.
Closed 9 years ago.
Improve this question
I want to use JavaScript to wipe out default text and allow user to enter a his choice word. How do I integrate this thing with my HTML code. I need it for testing purpose. Below is my HTML code.
<html>
<body bgcolor="black"><form method="get" action ="http://localhost:2013">
<center>
<font color="white" size=65>Enter Word:
<input type="text" name="word"></font></center>
</br><center>
<font color="Green" size=65>
<input type="submit" value="SUBMIT"></font></center><
form>
</body>
</html>
Any suggestions?
<!DOCTYPE html>
<body bgcolor="black"><form method="get" action ="http://localhost:2013">
<center>
<font color="white" size=65>Enter Word:
<input type="text" name="word" placeholder='Default Text'></font></center>
</br><center>
<font color="Green" size=65>
<input type="submit" value="SUBMIT"></font></center><
form>
</body>
</html>
Just add placeholder='Default Text' to your input element.
No need of much items, this will help you...
<form action="demo_form">
<input type="text" name="fname" placeholder="Your default text"><br>
<input type="text" name="lname" placeholder="Your default text"><br>
</form>

Categories