如何<a href>在InnerHTML中</a>隐藏<a href>标签</a>

Question

I have an image that has an InnerHTML for "a href" tag define in the .cs file as shown below.

_divToolTipContainer.InnerHtml = "<a href=\"javascript:__doPostBack('" + btnItemThumbnail.ClientID.Replace("_", "$") + "','')\">" +
                                           itemimage;

Now what I want is to have this "a href" tag "hide" or "set visible to false" if the textbox is empty otherwise have this click-able.

My code is shown below, but its not working.

    var oDivA1 = document.getElementById(oElementId);

    if(val === undefined || val == null || val.length <= 0){        
        oDivA1.style.display = "none"; // not working
    }else{
        oDivA1.style.display = "block"; // not working
    }

oDivA1.style.display = "none", this display none for the entire div not the "a href" tag only.

Is that possible?

Thanks

RJ

Answer 1

Use the firstChild property to get the inner element of the div, assuming that's all the HTML it contains as shown in your example.

var oDivA1 = document.getElementById(oElementId);
var anchor = oDivA1 ? oDivA1.firstChild : null;

if(anchor && (val === undefined || val == null || val.length <= 0)){        
    anchor.style.display = "none";
}else{
    anchor.style.display = "block";
}

To prevent the link action

var handler = function(e) { e.preventDefault(); };

if(anchor && (val === undefined || val == null || val.length <= 0)){        
    anchor.addEventListener('click',handler,false);
}else{
    anchor.removeEventListener('click',handler,false);
}

See https://developer.mozilla.org/en-US/docs/DOM/element.addEventListener for information on browser compatibility and workarounds for older browsers.