This question already has answers here:
Why does jQuery or a DOM method such as getElementById not find the element?
(6 answers)
Closed 2 years ago.
I have the following problem to solve, when I start writing text in input, this one should turn red. Unfortunately, for unknown reasons, the variable is unidentified. Perhaps the problem is that js is not able to define the variable as input. I don't understand something here. Please help.
var input_Login = document.getElementsByTagName('input')[0];
console.log(input_Login);
function inputCheck(input_Login){
input_Login.style.color='pink';
}
var doit = input_Login.addEventListener('oninput', inputCheck);
You need to use the event input and the keyword thisin your function, see the example below:
var input_Login = document.getElementsByTagName('input')[0];
console.log(input_Login);
function inputCheck(input_Login){
this.style.color='pink';
}
var doit = input_Login.addEventListener('input', inputCheck);
<input type="text">
Related
This question already has answers here:
javascript named function expressions - scope accessibility [duplicate]
(4 answers)
Closed 2 years ago.
I'm trying to return and access the value of a dynamic select from onchange event. I know how to work with function declarations but function expressions are unclear to me. A little help would be appreciated.
js
//create select
var select = document.createElement('select');
select.setAttribute('id','select_month');
//onchange
select.onchange = function changeMonth(selectedmonth){
selectedmonth = this.value;//works well here
return selectedmonth;
};
var selectedmonth = changeMonth();//undefined
changeMonth is a variable that is scoped only to the function itself, and is therefore not available to the rest of the script.
Even if it was available, then realise that when that function is called by the DOM (when the event fires), it calls it with this bound to the DOM element. When you call it explicitly in your code, you should do the same.
The good thing is that the reference to the function is available as select.onchange, so use that. That way you solve both issues at the same time:
var selectedmonth = select.onchange(select);
This question already has answers here:
Check if element exists in jQuery [duplicate]
(8 answers)
Closed 6 years ago.
Let's say we have:
var $letsTestA = $( '.lets-test-a' ),
$letsTestB = $( '.lets-test-b' );
While the HTML is:
<div class="lets-test-a"></div>
(I know, I left out .lets-test-b)
Now, what happens if we try to call the variable $letsTestB?
I did do some testing, I'm not just blindly asking a question without doing some research first, but I'm a little confused with how this seems to work...
If I alert($letsTestA); or alert($letsTestB); I get the same outcome which is just [object Object] when testing from JSFiddle?
Here's my test fiddle: https://jsfiddle.net/m6j03423/
Furthermore to this, what I'm actually trying to do here is create a way to find out whether the content of a variable exists or not.
In PHP I would just write if (empty($myVar)) { // do action } but JS doesn't work the same way.
In JS I think I can write if ($letsTestA) { } and it should be able to print the result of the variable? But, I'm still getting [object Object].
What am I missing?
Can I even print the contents of a jQuery object?
How can I test whether the variable contains the true value of a jQuery object?
EDIT:
Admittedly, I did see a few different answers saying to check the length, but I didn't understand that enough to connect that to what I'm doing.
You can use the .length property of the object to ascertain whether elements exists or not
if ($letsTestA.length > 0) {
//element exists
}
var $letsTestA = $('.lets-test-a'),
$letsTestB = $('.lets-test-b');
console.log($letsTestA.length);
console.log($letsTestB.length);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="lets-test-a"></div>
This question already has answers here:
Use dynamic variable names in JavaScript
(19 answers)
Closed 7 years ago.
I have a question that I could not find the answer, or perhaps cannot phrase the way it should...
I would like to trick javascript's way of handling variables...
Let's say in php I could do something like:
$test['usr_'.$id]=826
But when I try to do the same in Javascript/jQuery:
$("#usr_rank_h").val('rank_'+id);
It will output rank_826 instead of the value of the var rank_826
The equivalent idiom in javascript is actually
var id = 826;
var test = {};
test['rank_'+id] = 826;
Which gives you back an object of the form
{
'rank_826': 826
}
PS: I'm not sure why you are using jQuery in this case, are you getting the id from an input ?
This question already has answers here:
Can't append <script> element
(18 answers)
Closed 7 years ago.
I'm trying to add a variable in a iframe, it works in Javascript way but it does not do what I want in Jquery way. Here is a jsfiddle.
Pure javascript way:
var iframeDocument = $('#iframe')[0].contentWindow.document;
var scriptObject = iframeDocument.createElement("script");
scriptObject.type = "text/javascript";
scriptObject.innerHTML = "var variable=9;";
iframeDocument.body.appendChild(scriptObject);
Result is okay in console (variable is set and equals to 9 and iframe context) :
And when I try to change the value of the variable in JQuery:
$('#iframe').contents().find('body').append($('<script type="text/javascript">').html('variable=10;'));
The variable is loaded in parent context and didn't change in iframe!
I know Javascript way is often better than Jquery way but I am simply wondering why this doesn't work as expected.
You are missing </script>, which by the way, you cant't inject like that.
Try this:
$('#iframe').contents().find('body').append($('<script type="text/javascript"><\/script>').html('var variable=10;'));
This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
javascript object, access variable property name?
I am messing around with JS, learning a stuff and I am wondering about something...
Say you have a function aFunc(), and you accept a string aFunc(val). The value is user defined and is then used to modify the CSS of an element.
For Example:
function aFunc(val){
document.getElementById('something').style.val = 'red';
}
Say the user entered borderColor, it would somehow refrence borderColor where val is. I do not know how or if this is possible.
EDIT:
Please no eval() :)
Just use this as a base: JSBIN- Demo on a Div
var type = prompt("style");
var value = prompt("value");
document.body.style[type] = value;
Every object in JavaScript has a method called hasOwnProperty which takes a string value and will return a Boolean value.
var myObj = {
name: "Josh"
};
myObj.hasOwnProperty("name") === true; //This is true
You can use that to test for the presence of a particular property and then use the method stated in Akhil Sekharan's answer to access that property.