javascript - 隐藏和显示跨度

Question

这是我的由 PHP 生成的 HTML 代码。

<p id="resp19" class="resp">
<img src="logos/RO.png"><br>
<b>CompanyRO</b>
<span class="fprice">XXXXXX</span>
<span class="f_row">
<input name="first_row" type="radio">AAAAAAAAAA</span><br>
<span class="buts"><input class="f_det" value="Details" onclick="ShowDetails(resp19)" type="button">                                             
<input class="f_det" value="Share" type="button"></span>
<span style="display: none;" class="details_content">
Detalii
</span>

在此之后，我隐藏了这个 span $('.details_content').hide();。我希望当我按下 Details 按钮时，会显示带有 details_content 的跨度，仅用于 this <p>。

我怎样才能做到这一点 ？

Answer 1

您需要将字符串传递给函数onclick="ShowDetails(resp19)"：

onclick="ShowDetails('resp19')"

然后在函数中ShowDetails写：

function ShowDetails(someId) {
    $('#' + someId + ' span.details_content').show();
}

此外，当您使用 jQuery 更好地click使用方法附加事件时click()：

html:

<input id="details_button" class="f_det" value="Details" type="button">

JS：

$('#details_button').click(function() {
    ShowDetails('resp19');
});

请注意，您使用<p>的是用于段落的元素，它们是内联元素。更好的使用将是<div>或其他块元素。