development

jQuery: using a variable as a selector

big-blog 2021. 1. 9. 11:25
반응형

jQuery: using a variable as a selector


This question already has an answer here:

I'm having problems using a variable as the selector for a paragraph on which I want to take action. Specifically I have several title elements and the same number of paragraphs. The desired result is that if I click on Title1 then I take an action on paragraph1. I made a simple case for development purposes whereby if I click on a title then the text of the corresponding paragraph changes color. If I hard code the solution it works but passing in a variable as the selector fails.

The jQuery is as follows:

    jQuery(document).ready(function($){
       $(this).click(function(){

        var target=(event.target.id);// Get the id of the title on which we clicked. We will extract the number from this and use it to create a new id for the section we want to open.
        alert(target);// checking that we are getting the right value.
        var openaddress=target.replace(/click/gi, "section");//create the new id for the section we want to open.
        alert('"#'+openaddress+'"');//Confirm that the correct ID has been created
        $('"#'+openaddress+'"').css( "color", "green" );//get the id of the click element and set it as a variable.
        //$("#section1").css( "color", "green" );//Test to confirm that hard coded selector functions correctly.

            return false;// Suppress the action on the anchor link.
            });


    });

The alert returns the following variable alert returned showing the value of the variable which appears to be correct and matches the hard coded version. I've omitted the html since it works in the hard coded version I assume there is no problem on that side.

I'd appreciate any guidance on what I'm doing wrong and how to correct it.

Thanks


You're thinking too complicated. It's actually just $('#'+openaddress).

ReferenceURL : https://stackoverflow.com/questions/17097947/jquery-using-a-variable-as-a-selector

반응형