PDA

View Full Version : Problem with _blank in XHTML Strict 1.0



nickHiebert
Apr 8th, 2010, 06:47 PM
I just changed the website I was working on to XHTML Strict 1.0.

The Website:
http://nickhiebert.com/thewriteimpression/write.impression.ca/

I made it valid by getting rid of target="_blank" and replaced it with

li><a href="javascript:;" onclick="window.open('http://write-impression.ca/resumes.html');" title="Resumes">Resumes</a></li>
And now when I cover over the link it displays "javascript:;"

But I want it to display the link name such as http://nickhiebert.com/thewriteimpression/write.impression.ca

My supervisor from my placement suggested I should put a <div> or a <span> tag inside <li>s.

Any help would be a appreciated.

Thanks!

Excavator
Apr 8th, 2010, 06:55 PM
Hello nickHiebert,
The target attribute is not valid in XHTML Strict for a reason - see http://robertnyman.com/2006/02/13/how-evil-is-the-target-attribute/

That js hack is just circumventing the validator.

If you really need to use target="anything" then use the XHTML Trasnitional DocType. That's what it's for. - http://www.w3.org/MarkUp/2004/xhtml-faq#target

nickHiebert
Apr 8th, 2010, 07:07 PM
Hello nickHiebert,
The target attribute is not valid in XHTML Strict for a reason - see http://robertnyman.com/2006/02/13/how-evil-is-the-target-attribute/

That js hack is just circumventing the validator.

If you really need to use target="anything" then use the XHTML Trasnitional DocType. That's what it's for. - http://www.w3.org/MarkUp/2004/xhtml-faq#target

Take another read to what I said.

Excavator
Apr 8th, 2010, 07:18 PM
Take another read at what I said.
Your javascript is opening a new window. The whole issue is you deciding how my browser handles a link, that's why it's not valid.

Just because you use some js to hide the fact your link is opening a new window doesn't make it valid, it just means the validator can't see you doing it.

Trasitional DocType. Did you read the link?
Why was the target attribute removed from XHTML 1.1?
It wasn't. XHTML 1.0 comes in three versions: strict, transitional, and frameset. All three of these were deliberately kept as close as possible to HTML 4.01 as XML would allow. XHTML 1.1 is an updated version of XHTML 1.0 strict, and no version of HTML strict has ever included the target attribute. The other two versions, transitional and frameset, were not updated, because there was nothing to update. If you want to use the target attribute, use XHTML 1.0 transitional.

MattF
Apr 8th, 2010, 07:23 PM
Just ditch the href part completely. It's not needed if you're just using it as a JS anchor tag.

Excavator
Apr 8th, 2010, 07:26 PM
I'm pretty sure this bit will display the link text instead of "javascript:;"
http://www.456bereastreet.com/archive/200605/opening_new_windows_with_javascript_version_11/

If that doesn't then I know the earlier version of that does. It can be found at http://www.456bereastreet.com/archive/200605/using_javascript_instead_of_target_to_open_new_windows/

Samhain13
Apr 8th, 2010, 07:57 PM
Here's a dirty workaround.

1. Give your list of links an id.
2. Since you're using JavaScript anyway, try this:


<!-- Your list of links. //-->
<ul id="a-new-id">
<li><a href="http://write-impression.ca/resumes.html">Resumes</a></li>
</ul>


<script type="text/javascript">
<!--
// Get all the links inside the list and change their behaviour.
var a = document.getElementById('a-new-id').getElementsByTagName('a');
for (var i=0; i<a.length; i++) {
var old = a[i].href;
a[i].onclick = function () {
this.href = window.location; // so this window doesn't go anywhere.
window.open(old);
};
}
//-->
</script>

nickHiebert
Apr 8th, 2010, 08:05 PM
I'm pretty sure this bit will display the link text instead of "javascript:;"
http://www.456bereastreet.com/archive/200605/opening_new_windows_with_javascript_version_11/

If that doesn't then I know the earlier version of that does. It can be found at http://www.456bereastreet.com/archive/200605/using_javascript_instead_of_target_to_open_new_windows/

Thanks! The first link works.

nickHiebert
Apr 8th, 2010, 08:20 PM
Here's a dirty workaround.

1. Give your list of links an id.
2. Since you're using JavaScript anyway, try this:


<!-- Your list of links. //-->
<ul id="a-new-id">
<li><a href="http://write-impression.ca/resumes.html">Resumes</a></li>
</ul>


<script type="text/javascript">
<!--
// Get all the links inside the list and change their behaviour.
var a = document.getElementById('a-new-id').getElementsByTagName('a');
for (var i=0; i<a.length; i++) {
var old = a[i].href;
a[i].onclick = function () {
this.href = window.location; // so this window doesn't go anywhere.
window.open(old);
};
}
//-->
</script>

Thanks I`ll take note of this as well.

Excavator
Apr 8th, 2010, 08:32 PM
Thanks! The first link works.

Here's an interesting article - http://articles.sitepoint.com/article/beware-opening-links-new-window
It shows reasons why not to open in a new window, though we've already covered that, and a few simple ways of telling users thats what the link is going to do.

nickHiebert
Apr 8th, 2010, 08:39 PM
I'm pretty sure this bit will display the link text instead of "javascript:;"
http://www.456bereastreet.com/archive/200605/opening_new_windows_with_javascript_version_11/

If that doesn't then I know the earlier version of that does. It can be found at http://www.456bereastreet.com/archive/200605/using_javascript_instead_of_target_to_open_new_windows/

In the Javascript file that is provided in the first link you posted. How do you get rid of: var strNewWindowAlert = " (opens in a new window)";

I don`t want that displaying. Otherwise that javascript file works.

MattF
Apr 8th, 2010, 08:48 PM
Just out of curiosity, any reason for not going the simple route, (keeping both JS and non JS compatible)?



<a href="http://write-impression.ca/resumes.html" onclick="window.open('http://write-impression.ca/resumes.html'); return false;" title="Resumes (Note: This link will open in a new window if JS is enabled.)">Resumes</a>

nickHiebert
Apr 8th, 2010, 08:51 PM
Just out of curiosity, any reason for not going the simple route, (keeping both JS and non JS compatible)?



<a href="http://write-impression.ca/resumes.html" onclick="window.open('http://write-impression.ca/resumes.html'); return false;" title="Resumes (Note: This link will open in a new window if JS is enabled.)">Resumes</a>


I just found it as a suggestion online. I`m just trying to figure out a good way to make it work. That`s all.

nickHiebert
Apr 8th, 2010, 09:10 PM
Just out of curiosity, any reason for not going the simple route, (keeping both JS and non JS compatible)?



<a href="http://write-impression.ca/resumes.html" onclick="window.open('http://write-impression.ca/resumes.html'); return false;" title="Resumes (Note: This link will open in a new window if JS is enabled.)">Resumes</a>


Thanks! That worked. Thanks so much. :)

abduraooft
Apr 9th, 2010, 12:33 PM
Just out of curiosity, any reason for not going the simple route, (keeping both JS and non JS compatible)?



<a href="http://write-impression.ca/resumes.html" onclick="window.open('http://write-impression.ca/resumes.html'); return false;" title="Resumes (Note: This link will open in a new window if JS is enabled.)">Resumes</a>

When using that method, this.href would be enough inside the function and no need to rewrite the url.

@nickHiebert, here's another interesting read with a possible solution at http://dev.akabillposters.com/dom-js/flag-toggle-external-links-jquery/