Question

我有一个JS函数，可以创建一个新的弹出窗口。

function newTab(center, section, tab) {
    currentItem.numWindows += 1;
    var title = "Window #" + currentItem.numWindows;
    var tabsObject = [center, section, tab];
    currentItem.windows[currentItem.numWindows] = window.open('popup.php', title, toolbar = 0, menubar = 0, navigationbar = 0);
    currentItem.windows[currentItem.numWindows].variable = tabsObject;
}

我想创建一个看起来像按钮的按钮，但就像一个链接。为了澄清，当用户右键单击按钮时，我需要它来打开标准浏览器选项，如“在新窗口中打开”或“在新选项卡中打开”。

而不是这导致标准的“otherpage.html”我需要它来调用我的JS函数（它反过来创建弹出窗口）。

我已经搜索过并且我一直在寻找看起来像链接但不像链接那样的示例。

我尝试过IameLemon的建议，

<a onclick="someFunction();"><button type="button">Text of Some Page</button></a>

此代码有效，但它不允许用户右键单击并访问链接附带的标准选项（能够在新选项卡或窗口中打开）

谢谢！

Answer 1

将CSS样式应用于锚点。

<a href='function();' style='whateverfloatsYourBoat'>value</a>

Answer 2

在链接中创建一个按钮：

<a href='newtab();'><button type=button>button text</button></a>

Answer 3

从另一个answer窃取。

为什么不在链接中包含一个按钮？这也是fiddle。

<a onclick="someFunction();"><button type="button">Text of Some Page</button></a>

Answer 4

Use CSS. Below will make a link look like a button. i.e., if you right click it, it will give you option to open in new tab, etc.

.SSSBUTTON_CONFIRMLINK {
    font-family: Arial,sans-serif;
    font-size: 11px;
    font-weight: normal;
    font-style: normal;
    font-variant: small-caps;
    color: rgb(64, 111, 53);
    background-color: rgb(222,235,181);
    letter-spacing: 1px;
    text-decoration: none;
    text-transform: capitalize;
    text-align: center;
    line-height: 20px;
    margin-left: 1px;
    border-width: 1px;
    border-top-color: rgb(142, 203, 98);
    border-bottom-color: rgb(114, 175, 69);
    border-left-color: rgb(142, 203, 98);
    border-right-color: rgb(114, 175, 69);
    border-top-style: none;
    border-bottom-style: solid;
    border-left-style: none;
    border-right-style: solid;
    height: 20px;
    white-space: nowrap;
    cursor: pointer;
}

<a class="SSSBUTTON_CONFIRMLINK" href="#top">Click Me</a>

创建功能类似于链接的按钮，并通过Javascript函数打开新的弹出窗口

4 个答案: