带有Javascript和PHP的多个ID

Question

我得做个简单的工作。

我有：

echo' <div class="col-sm-12" id="recensioni_titolo">
                        <form role="form" id="review-form" method="post" action="php\insert_comment.php">
                            <div class="row">

                                <div class="col-sm-8">
                                    <div class="form-group">
                                        <input type="text" class="form-control" name="Titolo" id="titolo_review" placeholder="Titolo">
                                        <input type="text" class="form-control" name="ID_locale" id="titolo_review" value="'.$id_Local.'" style="visibility: hidden; position:fixed;">
                                    </div>
                                </div>
                                <div class="col-sm-4">
                                    <fieldset class="rating">
                                        <input type="radio" id="star5'.$id_Local.'" name="Voto" value="5" /><label class = "full" for="star5'.$id_Local.'" title="Ottimo - 5 stelle"></label>
                                        <input type="radio" id="star4'.$id_Local.'" name="Voto" value="4" /><label class = "full" for="star4'.$id_Local.'" title="Buono - 4 stelle"></label>
                                        <input type="radio" id="star3'.$id_Local.'" name="Voto" value="3" /><label class = "full" for="star3'.$id_Local.'" title="Discreto - 3 stelle"></label>
                                        <input type="radio" id="star2'.$id_Local.'" name="Voto" value="2" /><label class = "full" for="star2'.$id_Local.'" title="Insufficiente - 2 stelle"></label>
                                        <input type="radio" id="star1'.$id_Local.'" name="Voto" value="1" /><label class = "full" for="star1'.$id_Local.'" title="Pessimo - 1 stella"></label>
                                    </fieldset>
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-md-12">
                                    <div class="form-group">
                                        <textarea class="form-control textarea" rows="3" name="Review" id="review" placeholder="Inserisci una descrizione.."></textarea>
                                    </div>
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-md-12">
                                    <button type="button" class="btn main-btn pull-right" name="submit_review" id="submit_review'.$id_Local.'">Invia</button>
                                </div>

                            </div>

此代码生成相同的东西5次。我必须找到一种方法在唯一模式下声明和使用id=“review”，因为有了这段代码：

$(document.getElementsByName("submit_review")).unbind().click(function() {
var chx = document.getElementsByName("Voto");
   for (var i=0; i<chx.length; i++) {
// If you have more than one radio group, also check the name attribute
// for the one you want as in && chx[i].name == 'choose'
// Return true from the function on first match of a checked item
if (chx[i].type == 'radio' && chx[i].checked) {
        $.ajax({
        url : "php/insert_comment.php",
        type : "post",
        data : $("#review-form").serialize(),
        success : function(data){
            $.ajax({
        url : "php/reviews.php",
        type : "post",
        data: {'id_Local' : $('.modal').attr('data-modal')},
        success : function(data){
            $('#box_recensioni').html(data);
            chx[i].checked=false;

    }
    })
    }
   })

    return true;
   } 
 }
 // End of the loop, return false
alert("Inserisci almeno il voto!!")
return false;
});

我只有第一个要素是起作用的。我可以用“id‘.$variable”生成id，但是我不知道如何引用javascript文件中的每个id。

先谢谢大家

Answer 1

正如其他人所说的那样，使用相同的ID将是无用的，相反，您可能需要使用类标识符。假设你想创建多个表单元素..。而且您在脚本中没有要使用的唯一标识符，您可以尝试以下我还没有测试过的标识符.

我看你已经拿到单选按钮了

​

var chx = document.getElementsByName("Voto");

​

并在if语句下对其进行了检查。

​

if (chx[i].type == 'radio' && chx[i].checked) {

​

如果是这样的话，也许您可以尝试通过执行以下操作来获取正在处理的单选按钮的最接近的表单元素(即选中)

​

var thisForm = chx[i].closest('form')
--and later do thisForm.serialize();

​

请查看以下内容，以了解使用最近的

Answer 2

在HTML中，ID应该是唯一的：

id全局属性定义了唯一标识符(ID)，在整个文档中必须是唯一的。

这就是为什么JavaScript只能获取ID的第一次出现，因为它应该是唯一出现的ID。您可能希望用类替换这些多ID，这在HTML5中至少是正确的，而且在Javascript中也会更聪明。

下面是一个链接到HTML文档中的文章，以确保您理解这个标记的作用。

Answer 3

您可以创建一个数组，然后通过每个单选按钮使用一个循环将id推入数组。然后为ids使用数组。

​

var radioIds = new Array();

$('.rating input[name="Voto"]').each(function(){
    radioIds.push($(this).attr('id'));
});

console.log(radioIds)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="col-sm-4">
  <fieldset class="rating">
    <input type="radio" id="star54" name="Voto" value="5" /><label class="full" for="star54" title="Ottimo - 5 stelle"></label>
    <input type="radio" id="star44'" name="Voto" value="4" /><label class="full" for="star44" title="Buono - 4 stelle"></label>
    <input type="radio" id="star34" name="Voto" value="3" /><label class="full" for="star34" title="Discreto - 3 stelle"></label>
    <input type="radio" id="star24'" name="Voto" value="2" /><label class="full" for="star24" title="Insufficiente - 2 stelle"></label>
    <input type="radio" id="star14" name="Voto" value="1" /><label class="full" for="star14" title="Pessimo - 1 stella"></label>
  </fieldset>
</div>

​