CODEWITHSUNDEEP
jquery
Christopher Orchard
Christopher Orchard

Reputation: 1357

Change link text upon click

I'm attempting to change a link's text upon a user clicking it.

So far I have attempted - 

<script src="/Includes/jquery-1.11.0.js">
    $(document).ready(function() {
        $('[name="LT"]').click(function() {
            $('[name="LT"]').text("Lucas Orchard");
        });
    });
</script>

However, I've had no luck in getting it to work. I've looked at previous posts on here, and attempted doing a separate binding for the click event as it is within link tags.

Any suggestions on how to resolve this will be appreciated.

Upvotes: 1

Views: 59

Answers (3)

kei
kei

Reputation: 20471

What element is [name="LT"] by the way?

If it's an input, then you'll have to use .val instead of .text

$('[name="LT"]').click(function() {
  $(this).val("Lucas Orchard");
});

Upvotes: 0

George Mauer
George Mauer

Reputation: 122052

The issue is that you seem to be under the impression that <script src=.. defines your dependencies. It does not. (Though it would be kind of awesome if it did).

Basically back in the day everyone used to put script tags all on the same page. As applications grew that got to be unmanageable for a variety of reasons so browsers allowed people to reference scripts externally. So a script tag should have either a body or an src tag, not (in 99.9% of cases) both.

In your case this is correct:

<script src="/Includes/jquery-1.11.0.js"></script>
<script>
    $(document).ready(function() {
        $('[name="LT"]').click(function() {
            $('[name="LT"]').text("Lucas Orchard");
        });
    });
</script>

The first script block will create window.jQuery and window.$ (this is the global scope). Then your second script block runs and uses it.

Upvotes: 2

Ram
Ram

Reputation: 144659

Your code is ignored as you have used src attribute for the script tag. Use a script tag for loading the js file and another for your current code.

Upvotes: 3

Related Questions