Jquery通过单击按钮获取值

时间:2014-07-26 06:03:37

标签: jquery html spring-mvc

从我的下面的html代码,我想通过使用jquery单击单选按钮来获取值。 我已经上课了=" tech"使用tech:$(this).closest('td').siblings('td.tech').text()

的文字

1.点击radion按钮值,文字

2.当我点击一个单选按钮得到它的表头(class =" factor")

  <table id="listTable" class="table table-striped">
            <thead>
                <tr>
                    <th>Skill ID</th>
                    <th>Skill Name</th>
                    <c:forEach items="${skillfactors}" var="skillfact" varStatus="j">
                        <th class="factor">${skillfact.factorName}</th>
                    </c:forEach>

                </tr>
            </thead>
            <tbody>
                <c:forEach items="${technologies}" var="tech" varStatus="i">
                    <tr>

                        <td nowrap="nowrap">${tech.id}&nbsp;</td>
                        <td nowrap="nowrap" class="tech">${tech.name}&nbsp;</td>


                        <c:forEach items="${skillfactors}" var="skillfact" varStatus="l">
                            <td nowrap="nowrap"><c:forEach items="${ratingList}"
                                    var="ratings" varStatus="k">

                                    <!-- working code -->
                                    <input type="radio" name="${tech.id}+${skillfact.id}"  class="rating"/>${ratings.name}

                        <br>

                                </c:forEach></td>
                        </c:forEach>

                    </tr>
                </c:forEach>

            </tbody>
        </table>

enter image description here

已经获得skillName.Now我想要单击按钮点击值&amp;它的表格标题

2 个答案:

答案 0 :(得分:1)

正如Arun P Johny在上面的评论所说:

如果您是在收音机的点击处理程序中执行此操作,则this.value应该为您提供值...否则请尝试

$(this).closest('td').find(':checked').val()

要获取factorName,如果可以修改模板的代码,可以在选项本身中放入data-factorName属性,如:

<input 
  type="radio" 
  name="${tech.id}+${skillfact.id}" 
  data-factorName="${skillfact.factorName}" 
  class="rating"/>
...

并像这样访问

$(':radio').on('click', function(){
  var skillFactorName = $(this).data('factorName');
});

比其他解决方案更快,更易读

答案 1 :(得分:0)

试试这个

jsfiddle

<table>
    <tr class="head">
        <td class="tab1">one</td>
        <td class="tab2">two</td>
        <td class="tab3">three</td>
    </tr>
    <tr class="data">
        <td><input type="radio" name="one"><lable>data one</lable></td>
        <td><input type="radio" name="one"><lable>data two</lable></td>
        <td><input type="radio" name="one"><lable>data three</lable></td>
    </tr>
</table>

$(function(){
    var table_td_head = $('table').find('tr.head td').length;
    var table_td_data = $('table').find('tr.data td').length;
    $("input[type='radio']").each(function(){        
        $(this).click(function(){
          //alert($(this).next().text());
          var table_inner_td_index = $(this).parent().index();
            alert(table_inner_td_index);
            alert($("table tr.head td:nth-child("+table_inner_td_index+")").attr('class'));
       });
    });
});