6

I have a table with rows, that when clicked, take the user to a page with more detailed information about the item that row was describing. Unfortunately, it always changes the current page, and our users would like to be able to middle-mouse/control click the rows in order to open a new tab if they want to. This choice is available with normal links, but not with my onclick it seems. An example is shown below:

<html>
    <body>
        <table border='1'>
        <tr onclick='window.open("http://www.google.com")'>
            <td>Open Another Window</td>
        </tr>
        <tr onclick='location.href="http://www.google.com"'>
            <td>Change Current Page</td>
        </tr>
        </table>
    </body>
</html>

What is the best way to simulate a normal link with an onclick event so the behaviour will be the same across different os/browsers, which I believe have different bindings for what triggers opening a link in a new tab.

Programster
  • 11,722
  • 8
  • 46
  • 54
  • If your table rows only have one cell, why are you using a table for this layout? Is this truly meant to display table data? Anyway this was asked previously. Here's a pretty good answer, but popup blocking will block your tab from opening: https://stackoverflow.com/a/11384018/7569308 – jsonp Jan 08 '20 at 03:08
  • The example only has one cell, but my real-world scenario doesn't. I do have a table of data to show. – Programster Jan 18 '20 at 12:18

3 Answers3

3

This works for me:

<tr onclick="window.open('http://www.google.com','_blank')">
Ahmad MOUSSA
  • 2,307
  • 18
  • 28
  • 2
    Your solution solves part of the problem nicely, specifically how to open a new page when a row is clicked. The OP would like their users to have the option: click opens in same page, right click gives the option to open in a new page. – William T. Mallard Mar 06 '20 at 06:02
0

Instead of handling the click event of the table row, use an anchor tag. The default behaviour for Ctrl+click for anchors is to open the URL in the href attribute in a new window or tab. If you want a new tab or window opened without the Ctrl button, you can use the target attribute of the anchor as well.

<td><a href="http://www.google.com" target="_blank">open another window or tab</a></td>
Nick
  • 146
  • 1
  • 7
  • 7
    The whole point is that the action is tied to the table row (this is why I use 'onclick'), not the cells or the cell content. It is easy enough to just create an 'a href' link in a td, but I need an action tied to if the user clicks anywhere on the row. – Programster Jun 25 '13 at 14:16
-1

<tr onclick="window.open('./putyourlink.php')"> it's still work to me also but pls put '_blank' like another answer it's good more </tr>
นีราภา ตองติดรัมย์
  • 1
  • Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Mar 11 '22 at 17:13