Question

我有一个切换链接来显示或隐藏表格。这是链接的代码。如果显示此链接，则链接与

下面的表格之间没有空行

<a id='togglelink' name='togglelink' href='javascript:ToggleTable();' title='Show Inactive EDB Appointments' >
    <p style='text-align:center'>Show Inactive EDB Appointments
</a>

点击链接后会显示一个表格，我会更改链接文字

link.innerHTML = "<P style='TEXT-ALIGN: center'>Hide Inactive EDB Appointments";

执行此代码后，链接和

下面的表格之间会出现一个空白行

Answer 1

您忘记关闭<p>代码。

link.innerHTML = "<p style='text-align: center'>Hide Inactive EDB Appointments</p>";

Answer 2

关闭HTML和JavaScript中的段落标记。

＆＃13;

<a id='togglelink' name='togglelink' href='javascript:ToggleTable();' title='Show Inactive EDB Appointments' >
    <p style='text-align:center'>Show Inactive EDB Appointments</p>
</a>

＆＃13;

link.innerHTML = "<p style='text-align: center'>Hide Inactive EDB Appointments</p>";

＆＃13;

Answer 3

而不是使用href =＆＃34; javascript：[某些代码]＆＃34;，这在所有浏览器中都不起作用，您应该使用如下所示的onclick属性并在{{3}中使用演示＆＃d; d }

<a id='togglelink' name='togglelink' href='#' title='Show Inactive EDB Appointments' onclick="ToggleTable();">
     <p style='text-align:center'>Show Inactive EDB Appointments
     </p><!-- Added in closing tag -->
</a>

说明：

我确保关闭<p>标记，但这不是问题。
我提供了一个示例ToggleTable（）函数，它猜测了如何初始化var link。如果使用jQuery，我建议document.getElementById('togglelink')或$('#togglelink')。
onclick属性的替代方法，如this fiddle中所述，是一个事件侦听器。下面的例子，如果使用jQuery：

function ToggleTable() {
    var link = document.getElementById("togglelink");
    link.innerHTML = "<P style='TEXT-ALIGN: center'>Hide Inactive EDB Appointments</p>";
}

$(document).on("click tap","#togglelink",function() {
    ToggleTable();
});

更改innerhtml值会产生一个空行

3 个答案:

说明：