We Keep Coding

jquery tooltip from html title attribute

I've been trying jQuery Tooltip from Bootstrap, which requires quite a few extra attributes:
<a rel="tooltip" data-placement="right" data-original-title="Hello" href="#">Tooltip Example</a>
There seems to be a bit of a problem with this though, because I use rel="nofollow" on quite a few URLs I want to use tooltip on, and it doesn't let me use both at once.
Even more important, I want an elegant fallback for users that don't have JavaScript enabled browsers.
I want to know if there's a way I can have jQuery Tooltip treat title="" attribute as data-original-title, and have a default preset for data-placement.
Fiddle: http://jsfiddle.net/FhGT3/

of course there is. you just add title="" and it will pick the text as tooltip.
<a rel="tooltip" data-placement="right" title="my title"
data-original-title="Hello" href="#">Tooltip Example</a>
Here's a sample:
http://jsfiddle.net/sunnykumar08/FhGT3/4/
Also for your second question: Yes, you can set a default preset for data-placement. You just need to specify "data-placement:'
Thanks!

You can call tool tips directly. Lets say you give all the <a> tags you want to have tool tips a class runtooltip
Something
just before the </body> you have
<script>
$('.runtooltip').each(function () {
var $this = $(this);
var options = {
placement: 'top'
}
$this.tooltip();
});
</script>
you can see the jsfiddle here http://jsfiddle.net/8gQ7L/

Concatenate Two strings in HTML in client side(No Server)

Can I concatenate two strings in HTML?
I want to achieve the following functionality-
go to the 1st DIV tag.
It could have been done using document.write() in javascript but I want to know if there is any concatenation functionality in HTML itself.

No, there isn't.
HTML is markup, it is not turing complete.

One (primitive) way to achieve this with JavaScript would be
<a href="#"
onclick="window.location.hash='#'+document.getElementsByTagName('div')[0].id; return false;">
go to the 1st DIV tag.
</a>
But since those links are useless when JS is not available, they should probably only be generated by JS in the first place.

No, there isn't. HTML is markup.
You should use dynamic HTML and JavaScript to achieve this.

you can do this by using this.href in java script
<a href="#" onload="this.href=this.href+document.getElementsByTagName('div')[0].id;" >
ex
<a href="targetWithInDoc.html" onload="this.href=this.href+'#block1';" >block 1</a>

This can't be done in the way you're attempting, but if JavaScript is running on the client anyway then you can still achieve the functionality you're looking for. You just need to separate the tag from the script:
Go to the first DIV tag
<script type="text/javascript">
document.getElementById('someID').href = '#' + document.getElementsByTagName('div')[0].id;
</script>

I know it wont help u now but I'm posting this for others who will come to this question by searching
we can achieve it this way :
<a href='<%#String.Concat("string1", "string2")%>'></a>

Get onClick element to return to the main element?

I'm awful with javascript and I'm having a problem with this one.
I'm using this code
<script>
function changeNavigation(id){
document.getElementById('members')
.innerHTML=document.getElementById(id).innerHTML
}
</script>
and HTML
`<span onClick="changeNavigation('members')" >MEMBERS</span>
<span onClick="changeNavigation('help')" >HELP</span>`
<div id="members>...</div>
<div id="help" style="display: none;>...</div>
But I can't get <span onClick="changeNavigation('members')" >MEMBERS</span> to actually go to an element "members" without duplicating everything inside of it in another id.
Is there a way to do this?

This can be done using only standard javascript, but personally I'd recommend going ahead and getting used to using jQuery. Here's an example jsfiddle using jQuery: http://jsfiddle.net/JnvCR/2/
Don't forget to include jQuery in your website:
<script src="http://code.jquery.com/jquery.js"></script>

You need to correct your syntax errors. Use onclick instead of onClick (pedantic). Make sure you close your attributes properly, you are missing a few closing " marks.
updated html
<span onclick="changeNavigation('members')" >MEMBERS</span>
<span onclick="changeNavigation('help')" >HELP</span>`
<div id="members">...</div>
<div id="help" style="display: none;">...</div>
There is also an error with your logic as you are simply replacing the contents of div#members with itself.
Updated JS without syntax errors, but still with dodgy logic
function changeNavigation(id){
document.getElementById('members').innerHTML=document.getElementById(id).innerHTML;
}
Demo fiddle
http://jsfiddle.net/ADGCV/
As far as your actual question goes, can you explain what you would like to happen a bit better??
Here's a possible solution http://jsfiddle.net/ADGCV/1/

Javascript regex .replace() not working

I vaguely learned how regex work earlier on my last question and thought that I would be able to use it with other strings. Apparently this is not the case. Below are the contents of a div called mqcontainer.
<a style="text-decoration:none;" href="http://i.imgur.com/TeC4R.png"><img src="http://i.imgur.com/TeC4R.png" alt="Posted Image">[br]<small></small></a><small>View Full Image</small>
My goal is to filter out this string so that it instead shows [url=http://i.imgur.com/TeC4R.png]Image[/url] when I click a button. This is what I have been trying:
$("#containerbtn").click(function(){
$("#mqcontainer").each(function(){
$(this).html(
$(this).html().replace(
/<a style="text-decoration:none;" href="(.*?)"><img src=".*?" alt="Posted Image">\[br\]<small><\/small><\/a><small><a href=".*?" class="view_full">View Full Image<\/a><\/small>/g,
'[url=$1]Image[/url]'
)
);
});
});
It is not working no matter what I try. Can anyone offer me some insight into the problem?

the [br] should be escaped in the regexp: \[br\]

Wrong:
$("#mqcontainer").each(function(){
$(this).html(
...
)};
)};
The code above can not be correct. Since there is only one div with the ID mqcontainer.
Try this:
$("#mqcontainer").html(
$("#mqcontainer").html().replace(/<a style="text-decoration:none;" href="(.*?)"><img src=".*?" alt="Posted Image">\[br\]<small><\/small><\/a><small><a href=".*?" class="view_full">View Full Image<\/a><\/small>/g, '[url=$1]Image[/url]')
);

<a style="text-decoration:none;" href="(.*?)"><img src=".*?" alt="Posted Image">\[br\]<small><\/small><\/a><small><a href=".*?" class="view_full">View Full Image<\/a><\/small>
The above should work.
I removed an extraneous ] that was after your image and before the escape [br].
Edit: And a note to add that looking at the revision history after seeing powtac's comments above this is in fact an error you introduced on editing in his suggestion.

When is the 'javascript:' prefix valid syntax?

I know that you can use a javascript: pseudo protocol for URLs in an <a> tag. However, I've noticed that Firefox and IE will both allow 'javascript:' to precede javascript code within a <script> tag. Is this valid syntax? Does it change the scoping rules?
Examples:
I've seen this many times:
<a onclick="javascript:alert('hello world!');">Hello World!</a>
But is this legal/valid syntax and does it do anything special:
<script type="text/javascript">
javascript:alert('hello world!');
</script>

Outside of the href attribute (where it is a protocol specifier), name: just creates a label (such as one might use with a continue or break).
See: Do you ever need to specify javascript: in an onclick?

You need the javascript: "protocol" when you want to put JavaScript in the href attribute of a link.
<!-- does not work -->
link
<!-- does work -->
link
<!-- also works -->
link
As far as I know (and please, if I'm wrong, someone correct me) there is no difference in scope, but there is a very important difference about this.
<!-- does not work -->
link
<!-- alerts "undefined" -->
link
<!-- works as expected, alerts "<url>#" -->
link

One thing to consider, our testers would always ding us if we did something like
<a href='javascript:openwindowmethod("url");'> stuff </a>
Rather than
<a href='url' onclick='return openwindowmethod(this.href);'> stuff </a>
The first method would only work if you click on it but not if you shift or alt clicked on it, or right clicked and went to open in a new window.
The second method would support all of that, as well as the ability to function the way it intended if the user just plain clicked the link.

The javascript: syntax can be used anywhere in a URL and executes the following string as a script. It is part of the HTML spec and AFAIK is supported by all current major browsers.