Passing String as parameter into jQuery function

Question

I'm having a strange jQuery issue. I'm writing a function that accepts a string as a parameter, and then am feeding that string into a jQuery selector.

Here is the function:

function myFunction(specialfields) {
   if(!$(specialfields).is(':focus')) {
       alert('thats not in focus');
   }
 }

However, I keep getting this error:

 Uncaught Syntax error, unrecognized expression: focus

What's strange though is that the '.is(':focus') ' works in other areas, when not accepting a parameter, and if I pass this:

 $(specialfields)

It does read as valid object. I am trying to pass a string like this:

#id1, #id2

In addition, this works:

$(specialfields).val()

Anyone have any idea whats going here?

BTW, you're using selector as the argument name, but passing specialfields to jQuery. — Joseph Silber
– Joseph Silber, Commented Jan 17, 2013 at 19:17
I believe I found the issue -- I was passing two varibles as specialfields "#id1, #id2". That may be breaking the focus — streetlight
– streetlight, Commented Jan 17, 2013 at 19:33

streetlight · Accepted Answer · 2013-01-17 19:39:11Z

1

Okay, I believe the issue was the fact I was passing two parameters into "specialfields", which broke the ':focus' selector as obviously you can't have two fields in focus at the same time.

It can be fixed by passing just a single selector in the function.

answered Jan 17, 2013 at 19:39

streetlight

5,97813 gold badges66 silver badges103 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Jeromy French · Accepted Answer · 2013-01-17 20:28:23Z

Conclusion

Your way worked all along and works faster than my waste-of-time alternative.

Detail

I defined the function a little differently, and I replaced the alert() functionality by passing the response to a <p id="response">.

HTML:

<input type="text" name="id1" id="id1" />
<br />
<input type="text" name="id2" id="id2" />
<br />
<p id="response">response</p>

JavaScript:

var myFunction = function (specialfields) {
  if ($(specialfields + ':focus').length === 0) {
    $('#response').text(specialfields + ' is not in focus');
  } else {
    $('#response').text(specialfields + ' is in focus');
  }
};

See http://jsfiddle.net/jhfrench/UufWD/ for a working example.

You'll notice I evaluate the passed-in parameter for :focus with if ($(specialfields + ':focus').length === 0).

I thought this would be faster, but that is not the case.

On the plus side, this method does handle multiple selector arguments (such as #id1, #id2'); see http://jsfiddle.net/jhfrench/UufWD/19/). But your original evaluation of if(!$(specialfields).is(':focus')) is better.

Now see http://jsfiddle.net/jhfrench/UufWD/14/ for a working example of your approach.

Community · Accepted Answer · 2017-05-23 12:27:43Z

0

I think .focus() should be enough, as :focus is not a selector.

There is no native solution but yes there is a more elegant way you can do it:

jQuery.extend(jQuery.expr[':'], {
  focus: "a == document.activeElement"
});

You're defining a new selector. See Plugins/Authoring. Then you can do:

if ($("...").is(":focus")) {
  ...
}

Source-- Is there a 'has focus' in JavaScript (or jQuery)?

edited May 23, 2017 at 12:27

CommunityBot

11 silver badge

answered Jan 17, 2013 at 19:26

SaK

4203 silver badges10 bronze badges

1 Comment

jbabey Over a year ago

jQuery 1.6 added :focus.

Collectives™ on Stack Overflow

Passing String as parameter into jQuery function

3 Answers 3

Comments

Conclusion

Detail

I thought this would be faster, but that is not the case.

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Conclusion

Detail

I thought this would be faster, but that is not the case.

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related