在div的div中获取文本作为按钮

时间:2014-12-20 20:27:34

标签: javascript jquery html

基本上,我有一些按钮

<div class="button">
  <!--Some other stuff-->
  <div class="id">HD5sjW</div>
</div>

<div class="button">
  <!--Some other stuff-->
  <div class="id">yqWH3X</div>
</div>

<div class="button">
  <!--Some other stuff-->
  <div class="id">KWZy5V</div>
</div>

我希望使用JavaScript链接到另一个页面而我找不到解释所以这就是我想出来的,显然根本不起作用 - 我是怎么想这样做的?

$('.button').click(function () {
        confirm("http://domain.com/thing?id=" + $(this + " .id").text());
});

确认只是一个明显的输出


另外,我应该如何更好地构建我的问题和标题类型?

2 个答案:

答案 0 :(得分:1)

您可以在jQuery函数中使用.find()或上下文参数。

$('.button').hover(function () {
        confirm("http://domain.com/thing?id=" + $(".id", this).text());
});

$('.button').hover(function () {
        confirm("http://domain.com/thing?id=" + $(this).find('.id').text());
});

答案 1 :(得分:1)

以下使用.click()使用.hover()的解决方案会导致确认框多次触发。

$('.button').click(function () {
        //find out which buttton this is
        var currentBtn = $('.button').index( $(this) );
        
        //use currentBtn to find its matching id div using `:eq()`
        var currentId = $('.id:eq('+currentBtn+')').text();
        confirm("http://domain.com/thing?id=" + currentId)
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<div class="button">
  <!--Some other stuff-->
  <div class="id">HD5sjW</div>
</div>
<br>
<div class="button">
  <!--Some other stuff-->
  <div class="id">yqWH3X</div>
</div>
<br>
<div class="button">
  <!--Some other stuff-->
  <div class="id">KWZy5V</div>
</div>