I want a clickable table. This code works in all browsers, except in IE8. I haven't tested in IE9, but it works in IE10. By not working I mean nothing happens when I click on the table. Why?
<a href="www.cnn.com" target="_blank" class="nonlink">
<table>
<tr>
<td>
<p>hello</p>
</td>
</tr>
</table>
</a>
This works of course:
<a href="www.cnn.com" target="_blank" class="nonlink">
hello
</a>
I tested the code in a clear webpage where no other code exists.
It'll obviously wont work since you using iligal way.
You cannot use <a> tag outside table tag.
However you can allways use <a> inside <p> tag so the code will be vaild, like that:
<table>
<tr>
<td>
<p>hello</p>
</td>
</tr>
</table>
EDIT
Here is an alternative way for your code so the table empty space will be fixed.
$('td').on("click", function(){
window.location = ""; // Add whatever your window location (I.E. index.html)
});
It does work, but it's definitely not good practice. From your example you should be able to include the anchor in the cell.
<table>
<tr>
<td>
<p>hello</p>
</td>
</tr>
</table>
Click here for a demo.
Related
Issue: I am facing issue in persisting the styling on an anchor tag on forwarding the email.
I have tried the behaviour on cross-devices and cross-browser even cross-platform(Mac and Windows).
Below is the demo code I used for email template:
<table>
<tbody>
<tr>
<td><a
href="http://helloworld.com"
style="color:#000000; text-decoration:none;">
Hello World
</a>
</td>
</tr>
</tbody>
</table>
Actual Result - All the styling are remove from anchor tag on forward.
Expected Result - All the styling should persist on anchor tag on forward.
I have a table which has [routerLink] on each <tr>. But, since there is no tag, I don't see the option "open link in a new tab" on right click. I tried surrounding the table row inside <a> tag but that just messes up all the CSS styles.
Is there a better/standard solution to tackle this issue?
This is what I tried:
<table>
<tr [routerLink]="url">
<a>
<td></td>
</a>
</tr>
.......
You can add a hyperlink inside the <tr> tag as follows,
<tr>
<td>
<a [routerLink]="url"> {{yourvalue}}
</a>
</td>
</tr>
You can try window.open() on click of each row.
I tried to nest a div before closing my tag to make a button around a tap to call tel: link:
<a href=”tel:+18888888888">
<div>
<table>
<tbody>
<tr>
<td rowspan="2"><img id="phone" src="/phoneimg.png" alt="xx"></td>
<td rowspan="2">Tap To Call NOW! 888.888.8888</td>
</tr>
</tbody>
</table>
</div>
</a>
When I upload the html file to my host I get a 404 error when I tap the button.
When I remove the div, and the closing tag is right behind the a href=”tel:+18888888888" tag (i.e. it has correct syntax without a div container before the closing tag) it works but is simply an undecorated link.
Any way to do this?
Thank you.
As dfionov correctly stated, you cannot include block elements inside inline elements. Anchors (<a>) are however an exception to the rule in HTML5, as explained in another answer.
I would like to also mention that for your use-case, tables should be avoided. They are for displaying tabular data not aligning an image.
There are a number of ways to do this with CSS, I would probably suggest using inline-block because it works on all modern browsers and is easier to understand than many of the alternatives.
<a href="tel:+18888888888">
<img id="phone" src="/phoneimg.png" alt="xx">
<span>Tap To Call NOW! 888.888.8888</span>
</a>
Corrected code:
<div>
<table>
<tbody>
<tr>
<td rowspan="2"><img id="phone" src="/phoneimg.png" alt="xx"></td>
<td rowspan="2">Tap To Call NOW! 888.888.8888</td>
</tr>
</tbody>
</table>
</div>
I have this div in source of website, and after click it shows more data.
<div class=infogroup>
<div onClick=requestAjax(); style=cursor:pointer; class=infoheading>Your Panels (Click to load results)<img style=float:right; src="/images/plus_sign.png" width=20 height=20></div>
<div id=resultsPanels style=display:none;>
<table width=100%>
<tr>
<td>
<center>Loading your results...</center>
</td>
</tr>
<tr>
<td>
<center><img src=/images/ajaxloader.gif></center>
</td>
</tr>
</table>
</div>
</div>
when i click it and do "inspect element" witch chrom i can see it in source website
when i copy xpatch the xpatch of interesting field is:
//*[#id="resultsPanels"]/div/table/tbody/tr[3]/td[3]
how do i select it in Jsoup ?
i tried like this but it isnt working:
elements = doc.select("//*[#id=\"resultsPanels\"]/div/table/tbody/tr[2]/td[3]");
this is what mozzila do when i click button:
Jsoup doesn't support javascript / ajax, but you can use an external library for that (i've listed some examples here).
Btw. is using CSS / jQuery selector syntax, not XPath. So this syntax will likely fail.
You can get an overview about Jsoups selector here: Use selector-syntax to find elements
I am having a coding issue with Chrome and Firefox. The page I'm building has a menu that is placed with an anchor and it shows fine in IE but not Chrome or FF. Here is the code for the anchor:
<TR>
<TD bgColor=#FFFFFF height=31 colSpan=4 noWrap><a name="awmAnchormenu"></a></TD>
</TR>
I was told this, but not sure how to make the change:
This is because you used "name" instead of ID in the Positioning Element (the <a> link you used).
First of all, due to formatting issues I strongly suggest using <div> or <span> instead of <a>.
Second, you have to use ID. Only IE considers "name" to work like an ID, so now your menu does not show in any other browser.
I'm not fixing the HTML itself, but I will fix the problem according to the person who instructed you. Try this:
<TR>
<TD bgColor=#FFFFFF height=31 colSpan=4 noWrap><a name="awmAnchormenu" id="awmAnchormenu"></a></TD>
</TR>
edit: OK, I can't take it. Here's the HTML fixed.
<tr>
<td bgcolor="#FFFFFF" height="31" colspan="4" nowrap="nowrap">
<a name="awmAnchormenu" id="awmAnchormenu"></a>
</td>
</tr>
It's still pretty old-school, but at least it's following some rules.
It's as he said. Replace name with id. Also consider changing a to div or span.
you can try this
<tr>
<td bgColor="#FFFFFF" height="31" colSpan="4" nowrap="nowrap">
<span id="awmAnchormenu"></span>
</td>
</tr>
also , you should not use capital letters for the html tags.
It means you should change <a name="awmAnchormenu"></a> to <span id="awmAnchormenu"></span>.