William Jiang

JavaScript,PHP,Node,Perl,LAMP Web Developer – http://williamjxj.com; https://github.com/williamjxj?tab=repositories

jQuery.wrap()

While my php+js codes with jQuery.wrap() function work fine in FF and Chrome, they don’t work at IE.

The following are the issue and solution of jQuery .wrap() in IE:

The codes are:
1. totally 2 type of elements: a image, and multi-checkbox.
2. orginally, the image is without a link.
3. when user select checkbox(es), this image is wraped with a link, to present checkbox is selected, and the image becomes clickable.
4. if un-select the checkbox, the image is unwrap.

5. The html codes:
<img src=”images/delete.png” width=”16″ height=”16″ border=”0″ title=”remove files” />
<input name=”deleted” type=”checkbox” value=”‘.$row[‘file’].'” />

4. The jQuery codes (in App package):


 count_deleted : function() {
  total = $("input[name='deleted']:checked").length;
  if(total>0) {
        if(App.count==0) {
            $("#img_delete").wrap('<a href="doSomeAction.php" target="i_view">');
            App.count ++;
        }
  }
  else {
    // alert($("#img_delete").parent().get(0).tagName);
    if($("#img_delete").parent().is('a')) {
      $("#img_delete").unwrap();
        App.count = 0;
      } 
  }
  return true;
}

The js doesn't work in IE. No link appears, and no further action.

I spent some time ad finally found out the solution: IE needs html tag closed, like the following:


$("#img_delete").wrap('<a href="doSomeAction.php" target="i_view"></a>');

The </a> is very important here, the closing tag is that ONLY requirement for IE to work flawlessly. Without the closing tag it will not work.

I noticed even in jQuery official webpage: http://api.jquery.com/wrap/ there is no such case. IE follows strictly with DHTML, otherwise it won't work. Is it good or not?

Advertisements

3 responses to “jQuery.wrap()

  1. Giraldi 07/26/2011 at 10:33 am

    In my case, the image tag is already enclosed within a link. With jQuery, I wrapped the image in a span. Thus ‘a>span>img’. Afterwards the link doesn’t work anymore in IE7… even after I added a closing tag for the span.

    Do you know why and how I can work around this?

  2. Giraldi 07/26/2011 at 10:59 am

    Never mind. Found the solution already. It was my mistake. Wrote “.wrap(”)” when it should’ve been “.wrap(”)”… mistakenly put a slash at the end..

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s