Question

问题是我想要改变所有具有相同类的元素。示例：

<select class="dntselect"  onchange="go(this); return false;">
    <option value="1">test1</option>
    <option value="2">test2</option>
    <option value="3">test3</option>
    <option value="4">test4</option>
</select>

<form>
    <input type="hidden" class="ppselect" name="item_name" value="XXX">
</form>

<form>
    <input type="hidden" class="ppselect" name="item_name" value="XXX">
</form>

<form>
    <input type="hidden" class="ppselect" name="item_name" value="XXX">
</form>

所以我想用选定的选项替换输入中的“XXX”值，例如。将“XXX”值替换为“test1”

我尝试了一些教程和一些自己的工作，但它不起作用。我无法想象如何去做。

<script>
    function go(x) {
        var elements = document.getElementsByClassName('ppselect').value;
        for (var i = 0; i < elements.length; i++) {
            elements[i].x.options[x.selectedIndex].text;
        }
    }
</script>

这不重复 - 因为我受到这些“重复”的启发，但我不知道在这种情况下如何做到这一点。

Answer 1

您的脚本对我来说没什么意义，但是您可能打算使用该类而不是您复制且无效的id。

我修改了你的功能，所以它可以工作但实际上对我来说仍然没有意义（将所有隐藏元素的值设置为选择）。

function go(x) {
  var el = document.getElementsByClassName('ppselect');
  for (var i = 0; i < el.length; i++) {
    el[i].value = x.options[x.selectedIndex].innerText;
  }
}

<select class="dntselect" onchange="go(this); return false;">
  <option value="1">test1</option>
  <option value="2">test2</option>
  <option value="3">test3</option>
  <option value="4">test4</option>
</select>

<form>
  <input type="hidden" class="ppselect" name="item_name" value="XXX">
</form>

<form>
  <input type="hidden" class="ppselect" name="item_name" value="XXX">
</form>

<form>
  <input type="hidden" class="ppselect" name="item_name" value="XXX">
</form>

Answer 2

让我们忽略您使用多个type=hidden元素的情况，在这种情况下，如果您想查看最新情况，则使用function go(x) { var text = x.options[x.selectedIndex].text; var elements = document.querySelectorAll('.ppselect'); elements.forEach(function(element){ element.value = text; }); };毫无意义。

所以回答这个问题。为什么不使用具有document.querySelectorAll()选项的.forEach()，如下所示：

＆＃13;

<select class="dntselect"  onchange="go(this); return false;">
  <option value="1">test1</option>
  <option value="2">test2</option>
  <option value="3">test3</option>
  <option value="4">test4</option>
</select>

<input type="text" class="ppselect" name="item_name" value="XXX">
<input type="text" class="ppselect" name="item_name" value="XXX">

<input type="text" class="ppselect" name="item_name" value="XXX">

＆＃13;

function go(x) {
    var text = x.options[x.selectedIndex].text;
    var elements = document.getElementsByClassName('ppselect');
    for(var i=0; i < elements.length; i++){
        elements[i].value = text;
    }
};

＆＃13;

而使用Document.getElementsByClassName()，你需要编写for loop

的内容几乎相同

＆＃13;

<select class="dntselect"  onchange="go(this); return false;">
  <option value="1">test1</option>
  <option value="2">test2</option>
  <option value="3">test3</option>
  <option value="4">test4</option>
</select>

<input type="text" class="ppselect" name="item_name" value="XXX">
<input type="text" class="ppselect" name="item_name" value="XXX">

<input type="text" class="ppselect" name="item_name" value="XXX">

＆＃13;

SELECT ClientId,
       CONCAT(FirstName,' ', MiddleName,' ', LastName) as FullName,
       SexId,
       Birthday,
       (CASE WHEN (SELECT COUNT(*) FROM ChildBirthdays WHERE ChildBirthdays.Client_Id = Clients.Id) = 0 THEN 0 ELSE 1 END) AS HasChild,
       CalculatedProperties_OrdersCount,
       CalculatedProperties_LastVisit,
       CalculatedProperties_TotalSpent,
       (CASE WHEN (CalculatedProperties_OrdersCount > 0) THEN CONVERT(decimal(10,2),CalculatedProperties_TotalSpent / CalculatedProperties_OrdersCount) ELSE 0 END) AS AverageSpent,
       (SELECT Cards.Id, 
               (SELECT [Sum] FROM Accounts WHERE Accounts.CardId = Cards.Id) AS [SumFromAccounts]
        FROM Cards WHERE Clients.Id = Cards.ClientId) AS CardsId   
FROM Clients

＆＃13;

Answer 3

这是因为document.getElementsByClassName('ppselect').value是undefined

你的功能应该是

function go(x)
{
var elements = document.getElementsByClassName('ppselect'); 
for (var i = 0; i < elements.length; i++) {
        elements[i].value=x.options[x.selectedIndex].innerHTML;
    }
}

更改具有相同类的所有元素的值将不起作用

3 个答案: