-1

I have this function on my page:

function selected(elmnt, name, id2check) {
        var x = document.getElementById(id2check).checked;
        if(x == false) {
                elmnt.style.backgroundColor = "#18436C";
                name.style.color = "#f9FfFf";
                document.getElementById(id2check).checked = true;
        } else {
                elmnt.style.backgroundColor = "transparent";
                name.style.color = "#18436C";
                document.getElementById(id2check).checked = false;
        }
    }   

The first param passed is "this" which doesn't require quotation marks. The other two are the id names of a div and an input (checkbox) respectively. The only way the function works is if the third parameter has quotation marks but the second parameter doesn't. Why is that?

    <div id="abbsmalone_container" onclick="selected(this, abbsmalone_name, 'abbsmalone_select')">
<input type="checkbox" class="selections" name="abbsmalone_select"  id="abbsmalone_select" value="yes" checked='checked' >
6
  • 3
    Strings are quoted, variables aren't.
    – j08691
    Jul 1, 2015 at 21:08
  • this is not a normal variable, it's a javascript operator. developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… Jul 1, 2015 at 21:10
  • But what is the difference between the second and third parameter? Are they not both strings? Jul 1, 2015 at 21:11
  • 1
    I have a feeling the second argument here is not a string but is actually a global variable (a reference to an element) because of what's discussed in this question. Jul 1, 2015 at 21:12
  • Can you create an example of the issue you're experiencing on jsFiddle.net?
    – j08691
    Jul 1, 2015 at 21:13

1 Answer 1

1

Thats because id2check a String type. All String type have to be used with"" or '' notation while assigning the value to a variable of String type, either it's got to be using "" or '' or else should be of type String. One more thing, you don't need to use this, if(x == false) here x is a boolean so the condition should be if(!x) thus you code would look like,

function selected(elmnt, name, id2check) {
        var x = document.getElementById(id2check).checked;
        if(!x) {
                elmnt.style.backgroundColor = "#18436C";
                name.style.color = "#f9FfFf";
                document.getElementById(id2check).checked = true;
        } else {
                elmnt.style.backgroundColor = "transparent";
                name.style.color = "#18436C";
                document.getElementById(id2check).checked = false;
        }
    } 

Here, elmnt is an object type hence you don't need to use "" or '' and thus you use this. You use "" or '' with things which are of type String.

One more thing,you are using name.style.color which says even name is not of String type and it is an object. You pass a String to document.getElementById(), that is you pass an id, an html element id, which is of String type, hence here, elmnt is of type Object, name is of type Object and id2check is of String type. Hence, use a "" or '' for id2check

7
  • Thank you for your well thought out response. I'm still a bit confused what makes the second param an object. I'm new to js so the term "object" means something different me (php). Since I was passing in the name of a div I figured it would be a string just the third param. I guess in js it's type depends on how it's used in the function and not what it references? Jul 1, 2015 at 22:30
  • "All String type have to be used with"" or '' notation." That may be confusing. A variable can have a string value; in that case you wouldn't use quotation marks, but it would still be accepted as a string. For example, instead of selected(this, abbsmalone_name, 'abbsmalone_select') you could have written var myString = 'abbsmalone_select'; selected(this, abbsmalone_name, myString). Jul 1, 2015 at 22:30
  • @DavidKnipe I agree with you, what I meant was while assigning the value to a variable to a String type, either it's got to be using "" or '' or else should be of type String. Understand that could be misleading. Jul 1, 2015 at 22:35
  • @thinkofacard, what makes name an object is the way you have implemented it here. e.g., if it was a String you would have said, document.getElementByID("name").style.color. but since you are using name.style.color, it proves it's an object as the property .style would act only on a DOM element(which is an element). So, it seems name is an object. Jul 1, 2015 at 22:43
  • 1
    Okay I think it have it. If the value passed isn't an object then what's inside the function wouldn't work. The odd part is that what is being passed in hasn't really been defined at all until it's passed. It's just a word. Kind of like quantum physics lol. Jul 2, 2015 at 22:06

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.