Jquery – how to change div text after form submit

jquery

i have a form to enter directions and display a google map

<form action="#" onsubmit="setDirections(this.from.value, 'address', 'en_US'); return false">

Outside the form i have the following:

Formatted Directions<div id="printdirec"><a href="http://maps.google.com/">Print Directions</a></div>

i want to change the value inside the div tag 'printdirec' to say something else

i tried this (which i thought would work) but it doesn't:

    <script type='text/javascript'>
        $(document).ready(function() {

        $(":submit").click(function(e) {
                $('div.printdirec').val('tttt')
            });

        });
</script>

any suggestions of what i am doing wrong?

Best Answer

The # symbol identifies the ID of the element. Use .text() to set the inner text.

$('div#printdirec').text('tttt');

Related Solutions

Javascript – How to check if an element is hidden in jQuery

Since the question refers to a single element, this code might be more suitable:

// Checks CSS content for display:[none|block], ignores visibility:[true|false]
$(element).is(":visible");

// The same works with hidden
$(element).is(":hidden");

It is the same as twernt's suggestion, but applied to a single element; and it matches the algorithm recommended in the jQuery FAQ.

We use jQuery's is() to check the selected element with another element, selector or any jQuery object. This method traverses along the DOM elements to find a match, which satisfies the passed parameter. It will return true if there is a match, otherwise return false.

Javascript – How to change the href attribute for a hyperlink using jQuery

Using

$("a").attr("href", "http://www.google.com/")

will modify the href of all hyperlinks to point to Google. You probably want a somewhat more refined selector though. For instance, if you have a mix of link source (hyperlink) and link target (a.k.a. "anchor") anchor tags:

<a name="MyLinks"></a>
<a href="http://www.codeproject.com/">The CodeProject</a>

...Then you probably don't want to accidentally add href attributes to them. For safety then, we can specify that our selector will only match <a> tags with an existing href attribute:

$("a[href]") //...

Of course, you'll probably have something more interesting in mind. If you want to match an anchor with a specific existing href, you might use something like this:

$("a[href='http://www.google.com/']").attr('href', 'http://www.live.com/')

This will find links where the href exactly matches the string http://www.google.com/. A more involved task might be matching, then updating only part of the href:

$("a[href^='http://stackoverflow.com']")
   .each(function()
   { 
      this.href = this.href.replace(/^http:\/\/beta\.stackoverflow\.com/, 
         "http://stackoverflow.com");
   });

The first part selects only links where the href starts with http://stackoverflow.com. Then, a function is defined that uses a simple regular expression to replace this part of the URL with a new one. Note the flexibility this gives you - any sort of modification to the link could be done here.

Best Answer

Related Solutions

Javascript – How to check if an element is hidden in jQuery

Javascript – How to change the href attribute for a hyperlink using jQuery

Related Topic