Question

这是我的HTML代码：

<td>
    <input type="hidden" name="user_id" class="user_id" value="18">
    <a class="contactnow" href="#" onclick="contactnow();">Contact Now</a>
</td>

我的javascript函数如下：

function contactnow()
{
    var id=$(this).parent('.user_id').val();
    alert(id);
}

我需要在点击此锚点时获取隐藏字段的值，这些锚点在与从数据库循环数据相同的页面上是多个。

Answer 1

删除内联事件处理程序并使用：

$('a.contactnow').click(function() {
  console.log($(this).prev('input').val())
})

<强> jsFiddle example

正如我上面评论的那样，$(this)并不是你认为的，因为你没有传递给你的函数。您需要.prev()元素，而不是.parent()。

Answer 2

在onclick属性中传递引用。

<a class="contactnow" href="#" onclick="contactnow(this);">Contact Now</a>

使用此

function contactnow(e)
{
   var id=$(e).parent().find('.user_id').val();
   //or
   var id=$(e).siblings('.user_id').val();
   alert(id);
}

然而，不是在html属性中使用javascript，您可以完全分离您的javascript，这样更清洁，并且您不必每次都重复onclick以使其在多个元素中工作。删除onclick属性

HTML

<a class="contactnow" href="#">Contact Now</a>

JS

$('.contactnow').click(function(){
    var id=$(this).parent().find('.user_id').val();
    //or
    var id=$(this).siblings('.user_id').val();
    alert(id);
});

// if you are using dynamically added element use

 $(document).on('click','.contactnow', function(){
    var id=$(this).parent().find('.user_id').val();
    //or
    var id=$(this).siblings('.user_id').val();
    alert(id);
});

Answer 3

如果要继续使用内联事件处理程序，则需要传递this关键字。

变化：

onclick="contactnow();"

为：

onclick="contactnow(this, event);"

function contactnow(ele, e)
{
  var id=$(ele).siblings('.user_id').val();
  alert(id);
}

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>

<table>
    <tbody>
    <tr>
        <td>
            <input type="hidden" name="user_id" class="user_id" value="18">
            <a class="contactnow" href="#" onclick="contactnow(this, event);">Contact Now</a></td>
    </tr>
    </tbody>
</table>

Answer 4

我看到你标记了jquery，这是一个简单的例子。

$('button').on('click', function () {
    var answer = $(this).prev().val();
    alert(answer) 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<input type="hidden" value="4">
<button>click me</button>

表格锚点击获取父类值

4 个答案: