如何获取html表单的输入标签ID?

时间:2014-03-20 07:55:38

标签: javascript php jquery html

<?php
        $i = 1;
        $query1 = mysql_query("SELECT * FROM `alert_history` ORDER BY `alert_history`.`id` DESC LIMIT ".$start.",".$per_page."");
        while($result = mysql_fetch_array($query1)){
            echo '<td colspan = "2"><form method = "POST" onsubmit = "submitform()" ><textarea onFocus = "myFunction(1)" onBlur = "myFunction(0)" id = "comment'.$i.'" name = "comment"></textarea> <br />';
            echo '<input type = "text" id = "alertid'.$i.'" name = "alertid" value = "'.$result['id'].'">';
            echo '<input  type = "submit" name = "submit" value = "Comment" ></form></td>';
            $i++;
        }
?>


<script>
    function submitform(){
            var comment = $("#comment").val();
        var alertid = $("#alertid").val();
        alert(comment);
        $.ajax({
        type: "POST",
            url: "analytic.php",
            data:{cmt:comment,alert_id:alertid}
        });
            //return false;
      }
</script>

如何为javascript函数获取textarea代码和input代码ID? 这两个标记都显示在while循环中,因此我希望每个textareainput标记具有不同的ID。

4 个答案:

答案 0 :(得分:1)

如果您在文本框中生成动态ID,那么如果在文本框中更改了某些内容,那么将其ID存储在本地变量中并在代码中使用它

<input type = "text" class="textBox" id = "alertid'.$i.'" name = "alertid" value = "'.$result['id'].'">';
var Id
  $(document).on('change', "input.textBox", function () {
             Id = $(this).attr("id");
alert(Id )
});

希望此代码可以帮助您..

答案 1 :(得分:0)

所以首先设置不同的ID,然后再获取它。

var textAreaId = $('textarea').prop('id);
var inputId = $('input').prop('id);

<强>更新

$ i 对于每一组 textarea和输入组合在一起是不变的。

如果你想获取每一组 textarea 输入,你应该为每个textarea和input元素分配ID而不是它。

<?php
        $i = 1;
        $query1 = mysql_query("SELECT * FROM `alert_history` ORDER BY `alert_history`.`id` DESC LIMIT ".$start.",".$per_page."");
        while($result = mysql_fetch_array($query1)){
            echo '<td colspan ="2" id='.$i.'"><form method = "POST" onsubmit = "submitform()" ><textarea onFocus = "myFunction(1)" onBlur = "myFunction(0)" name = "comment"></textarea> <br />';
            echo '<input type = "text" name = "alertid" value = "'.$result['id'].'">';
            echo '<input  type = "submit" name = "submit" value = "Comment" ></form></td>';
            $i++;
        }
?>



<script>
    function submitform(){
            var comment = $(this).closest('td').find('textarea').val();
            var alertid = $(this).parent().prop('id');
        alert(comment);
        $.ajax({
        type: "POST",
            url: "analytic.php",
            data:{cmt:comment,alert_id:alertid}
        });
            //return false;
      }
</script>

答案 2 :(得分:0)

在jQuery中,选择标记并使用.each()

$("textarea").each(function(){
   alert($(this).attr("id"));
   alert($(this).val());
});
$("input").each(function(){
   alert($(this).attr("id"));
   alert($(this).val());
});

演示here(客户端)。

答案 3 :(得分:0)

试试这个:

See JsFiddle working demo

<?php
        $i = 1;
        $query1 = mysql_query("SELECT * FROM `alert_history` ORDER BY `alert_history`.`id` DESC LIMIT ".$start.",".$per_page."");
        while($result = mysql_fetch_array($query1)){
            echo '<td colspan = "2"><form method = "POST" onsubmit = "submitform(this)" ><textarea onFocus = "myFunction(1)" onBlur = "myFunction(0)" id = "comment'.$i.'" name = "comment"></textarea> <br />';
            echo '<input type = "text" id = "alertid'.$i.'" name = "alertid" value = "'.$result['id'].'">';
            echo '<input  type = "submit" name = "submit" value = "Comment" ></form></td>';
            $i++;
        }
?>


<script>
    function submitform(form){

      var comment = $(form).find("textarea").val();
      alert(comment);

      var alertid = $(form).find("input[name=alertid]").attr("id");
      alert(alertid);
      //Or if you mean:
      var alertid = $(form).find("input[name=alertid]").val();
      alert(alertid);

        $.ajax({
        type: "POST",
            url: "analytic.php",
            data:{cmt:comment,alert_id:alertid}
        });
            //return false;
      }
</script>