如何使用jquery在<a></a>标记内获取文本框值

时间:2012-10-20 04:33:02

标签: javascript jquery html

这是我的HTML代码:

<div class="viewPopup login-popup"  id="login-box">
     <a href="#" class="close"><img src="images/close.png" class="btn_close" title="Close Window" alt="Close" /></a>
     <h6 class="h6">Task Name</h5>
     <div class="info">
      <p class="name">Assigned to </p>
      <p class="cont1"> Kumar</p>
     </div>
     <div class="info">
      <ul>
      <li><p class="name">Task </p></li>
      <li><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec condimentum est ut dolor aliquam sit amet suscipit urna vehicula. Nunc dolor massa, viverra commodo gravida sed, sodales et metus. Maecenas lacinia facilisis semper. Pellentesque ac tellus lacus.</p></li>
      </ul>

     </div>
     <div class="info">
      <p class="name">Starting Date </p>
      <p class="cont1"> 19/12/2012</p>
     </div>

     <div class="info">
      <p class="name">Ending Date </p>
      <p class="cont1"> 22/12/2012</p>
     </div>
</div>

<a href="#login-box" class="login-window" title="View">
    <input type="text" name="review_id" id="review_id" value="10" />
    <img src="images/eye.png" >
</a>
<a href="#login-box" class="login-window" title="View">
                        <input type="text" name="review_id_txt" id="review_id_txt" value="10" />
                        <img src="images/eye.png" >
                   </a>

这是我的jquery代码:

// JavaScript Document
$(document).ready(function() {
    $('a.login-window').click(function() {

                //Getting the variable's value from a link 
        var loginBox = $(this).attr('href');

        //Fade in the Popup
        $(loginBox).fadeIn(300);

        //Set the center alignment padding + border see css style
        var popMargTop = ($(loginBox).height() + 24) / 2; 
        var popMargLeft = ($(loginBox).width() + 24) / 2; 

        $(loginBox).css({ 
            'margin-top' : -popMargTop,
            'margin-left' : -popMargLeft
        });

        // Add the mask to body
        $('body').append('<div id="mask"></div>');
        $('#mask').fadeIn(300);

        return false;
    });

    // When clicking on the button close or the mask layer the popup closed
    $('a.close, #mask').live('click', function() { 
      $('#mask , .login-popup').fadeOut(300 , function() {
        $('#mask').remove();  
    }); 
    return false;
    });
});

这里我想获得该jquery代码中的文本框值。

这意味着review_id标记中包含一个文本框<a></a>

所以我想通过使用这个`标签来获取文本框值。

我知道这段代码:

$("#review_id").val();

但实际上我根据<a>得到了文本框值。

我该怎么做?

有可能吗?

编辑:

<?php for($i=0;$i<5;$i++){?>
<a href="#login-box" class="login-window" title="View">
                        <input type="text" name="review_ids" id="review_<?php echo $i;?>" value="<?php echo $i;?>" />
                        <img src="images/eye.png" >
                   </a>

这会创建5个<a>标记和5个文本框。然后我如何才能获得review_ids文本框值...

3 个答案:

答案 0 :(得分:2)

试试这样:

<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="content-type" content="text/html" />
    <meta name="author" content="gencyolcu" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
 $('a.login-window').click(function() {
          var valuet=   $(this).find("#review_id").val();
          alert(valuet);
});
</script>
    <title>Untitled 1</title>
</head>

<body>

<a href="#login-box" class="login-window" title="View">
                        <input type="text" name="review_id" id="review_id" value="10" />
                        <img src="images/eye.png" >
                   </a>


<a href="#login-box" class="login-window" title="View">
                        <input type="text" name="review_id" id="review_id" value="10" />
                        <img src="images/eye.png" >
                   </a>



<a href="#login-box" class="login-window" title="View">
                        <input type="text" name="review_id" id="review_id" value="10" />
                        <img src="images/eye.png" >
                   </a>


<a href="#login-box" class="login-window" title="View">
                        <input type="text" name="review_id" id="review_id" value="10" />
                        <img src="images/eye.png" >
                   </a>


</body>

</html>

答案 1 :(得分:1)

尝试

$(".login-window").find("#review_id").val()

JsFiddle

答案 2 :(得分:0)

你错过了尖锐的

$("#review_id").val();