Question

I’m calling a utility called Highslide in a javascript function. Embedding the whole thing in the link like this works fine:

<a href="http://localhost/theopscompany-local/test-page-1/" onclick = "return hs.htmlExpand(this, { 
            objectType: 'ajax', width: 400, 
            headingEval: 'this.a.title', wrapperClassName: 'titlebar' }     )">highslide test link1</a>

However, placing said code in a function and calling it via onclick like below doesn’t work. I’ve put it through jsfiddle and Firebug for syntax and all looks fine, but it just doesn’t fire the Highslide code for some reason. The linked page is loaded normally instead.

<a href="http://localhost/theopscompany-local/test-page-1/" onclick = "highslideview2();">highslide test link2</a>
<script type="text/javascript">
function highslideview2() {
    return hs.htmlExpand(this, { 
        objectType: 'ajax', 
        headingEval: 'this.a.title', wrapperClassName: 'titlebar' });}
</script>

I know this is likely a very simple thing, so I apologize if it’s below the level of the usual question, but I’m stumped and can’t see why this doesn’t work. The purpose is to a)clean up the HTML links and b) let me call different Highslide configurations for different types of links, so it’s important enough to pursue.

Thanks in advance for any help!

Answer 1

The return value is now the result of the code executed within highslideview2() and not the function run when the onclick handler is fired. Adding the return back into the inline onclick attribute should fix it.

<a href="http://localhost/theopscompany-local/test-page-1/" onclick = "return highslideview2(this)">highslide test link2</a>
<script type="text/javascript">
function highslideview2(e) {
    return hs.htmlExpand(e, { 
        objectType: 'ajax', 
        headingEval: 'e.a.title', wrapperClassName: 'titlebar' });}
</script>