Javascript 将现有代码更改为基于邻近性选择

当前HTML代码段：

<ul class="ShippingProviderList">
  <li>
    <label id="shippingMethod_500dae76abe48_0">
      <input id="shippingCheck_500dae76abe48" type="radio" value="0" name="selectedShippingMethod[500dae76abe48]" />
      <span class="ShipperName">My Own Shipping Account (Please make sure that account number is specified within your account page or item will not ship!)</span>
      <em class="ShipperPrice ProductPrice">$0.00</em>
    </label>
  </li>
  <li> 2nd option may or may not be here </li>
</ul>

我自己的发货账户（请确保在您的账户页面中指定了账号，否则商品将不会发货！）
$0.00

第二个选项可能在这里，也可能不在这里

当前Javascript代码段：

<script>
var radio = document.getElementById('shippingCheck_500d6aa9a300e'),
var input1 = document.getElementById('FormField_25'),
input2 = document.getElementById('FormField_26'),
btn = document.getElementById('ML20').getElementsByTagName('input')[0];

btn.onclick = function(e) {
if( radio.checked && input1.value.length >= 20 && input2.value.length >= 20 ) {
    alert('Please provide a Shipping Account Number in either the Billing or Shipping sections in order to use your own Shipping Account.');
    e.preventDefault(); // we all stop the submit from happening.
    e.stopPropagation();
    return false;
}
// otherwise do something or nothing and let the submit happen.
};
</script>

var radio=document.getElementById（'shippingCheck_500d6aa9a300e'），
var input1=document.getElementById（'FormField_25'），
input2=document.getElementById（'FormField_26'），
btn=document.getElementById（'ML20'）.getElementsByTagName（'input'）[0]；
btn.onclick=函数（e）{
if（radio.checked&&input1.value.length>=20&&input2.value.length>=20）{
警报（'请在帐单或装运部分提供装运帐号，以便使用您自己的装运帐号'）；
e、 preventDefault（）；//我们都阻止了提交。
e、 停止传播（）；
返回false；
}
//否则，做点什么或什么都不做，让提交发生。
};

---

问题是500d发货检查是随机生成的，我无法控制这种情况。是否可以通过使用span类“ShipperName”来调整Javascript以提取适当的数据，该类中包含术语My-Own Shipping，然后在这之前提取输入字段？还是有更好的方法来做这件事，我错过了？我无法分配ID、类或以任何方式更改在其中生成的实际html。

您可以使用jQuery尝试：

var radio = $('[id^="shippingCheck"]');

---

这将找到一个id以字符串“shippingCheck”开头的元素。

您可以使用jQuery进行尝试：

var radio = $('[id^="shippingCheck"]');

---

这将找到一个id以字符串“shippingCheck”开头的元素。

如果jQuery是可接受的，您可以使用：

$("input[id^='shippingCheck']")

var radio = fetchInput();

使用普通Javascript，您可以使用以下函数：

function wildcard(startingId){
  // get all inputs
  var inputs = document.getElementsByTagName("input");
  // iterate over them
  for ( var i = 0; i < inputs.length; i++ ) {

    if ( inputs[i].nodeType === 1 ) {
      // id start with 'shippingCheck' ?
      if (inputs[i].id.indexOf(startingId) == 0)
      {
         return inputs[i];
      }
    }
  }
}

---

您可以尝试以下方法：

function fetchInput() {
    var input;
    $(".ShipperName").each(function() {
        if ($(this).text().indexOf("My Own Shipping Account") != -1)
        {
            input = $(this).prev().get(0);
            return;
        }
    });
    return input;
}

这样称呼它：

wildcard("shippingCheck")

fetchInput();

var inputId = fetchInput().id;

该函数返回DOM元素，因此您可以访问

id

属性，例如：

wildcard("shippingCheck")

fetchInput();

var inputId = fetchInput().id;

---

您基本上只希望您的

radio

变量是对DOM元素的引用，对吗？所以你可以用这个：

$("input[id^='shippingCheck']")

var radio = fetchInput();

---

如果jQuery是可接受的，您可以使用：

$("input[id^='shippingCheck']")

var radio = fetchInput();

使用普通Javascript，您可以使用以下函数：

function wildcard(startingId){
  // get all inputs
  var inputs = document.getElementsByTagName("input");
  // iterate over them
  for ( var i = 0; i < inputs.length; i++ ) {

    if ( inputs[i].nodeType === 1 ) {
      // id start with 'shippingCheck' ?
      if (inputs[i].id.indexOf(startingId) == 0)
      {
         return inputs[i];
      }
    }
  }
}

---

您可以尝试以下方法：

function fetchInput() {
    var input;
    $(".ShipperName").each(function() {
        if ($(this).text().indexOf("My Own Shipping Account") != -1)
        {
            input = $(this).prev().get(0);
            return;
        }
    });
    return input;
}

这样称呼它：

wildcard("shippingCheck")

fetchInput();

var inputId = fetchInput().id;

该函数返回DOM元素，因此您可以访问

id

属性，例如：

wildcard("shippingCheck")

fetchInput();

var inputId = fetchInput().id;

---

您基本上只希望您的

radio

变量是对DOM元素的引用，对吗？所以你可以用这个：

$("input[id^='shippingCheck']")

var radio = fetchInput();

请尝试以下方法：

var radio = $('.ShipperName:contains("My Own Shipping")').siblings(':radio');

它将在包含“我自己的配送”的

.ShipperName

旁边找到一个单选按钮。请尝试以下操作：

var radio = $('.ShipperName:contains("My Own Shipping")').siblings(':radio');

---

它会在包含“我自己的配送”的

.ShipperName

旁边找到一个单选按钮。

如果您想通过纯javascript获取上一个元素，您可以使用

previousSibling

属性进行一些检查，如下面的函数。参数n是您案例中的跨度元素

函数getPreviousSibling（n）{
var x=n.以前的兄弟姐妹；
while（x.nodeType！=1）{//检查它是否是元素节点
x=x.以前的兄弟姐妹；
}
返回x；
}

但是，如果您使用类“ShipperName”获取span的上一个输入元素，您将获得多个无线电输入（因为列表中可能有多个项）。你仍然需要做一些额外的事情来得到你想要的，但是至少你可以使用无线电输入的id并用它做一些事情

看

---

如果使用jQuery，选择元素会更容易。

如果希望通过纯javascript获取上一个元素，可以使用

previousSibling

属性并进行一些检查，如下面的函数。参数n是您案例中的跨度元素

函数getPreviousSibling（n）{
var x=n.以前的兄弟姐妹；
while（x.nodeType！=1）{//检查它是否是元素节点
x=x.以前的兄弟姐妹；
}
返回x；
}

但是，如果您使用类“ShipperName”获取span的上一个输入元素，您将获得多个无线电输入（因为列表中可能有多个项）。你仍然需要做一些额外的事情来得到你想要的，但是至少你可以使用无线电输入的id并用它做一些事情

看

---

如果您使用jQuery，选择元素会更容易。

如果您可以使用jQuery，您可以使用。它将根据原始选择器获取无线电输入。请注意，缩进代码以指示包含有助于可读性。一个像样的代码编辑器或IDE会自动为您做到这一点。如果您可以使用jQuery，我想您可以使用.sides（“：radio”）。它将根据原始选择器获取无线电输入。请注意，缩进代码以指示包含有助于可读性。一个像样的代码编辑器或IDE会自动为您执行此操作。不起作用，可能其他元素的id以shippingcheck开头（如fedex、ups等）。不起作用，可能其他元素的id以shippingcheck开头（如fedex、ups等）。由于还有其他收音机选项也以shippingcheck开始，因此此功能是否仍然有效？该功能将返回以“shippingcheck”开始的第一个输入。如果这是您想要的，那么是的，它会起作用。返回第一个将不起作用。不幸的是：（-它确实必须以某种方式从确切的名称中提取出来…但是我感谢您的尝试！我不确定您的意思。如果您需要确切的名称，您可以使用

通配符（“shippingCheck”）.id

您想返回哪一个？可能有1个、4个或20个不同的选项，所有这些选项在开始时都会生成相同的“shippingCheck”id，我要的id（只有自己的装运方法）可能甚至不是生成的id的一部分。这是否仍然有效，因为还有其他无线电选项