Question

我需要解决用户在现场模拟操作的一个小问题：选择某个标签，然后按“OK”按钮。有几行标记，所以我决定用jQuery在for循环中做。但是这段代码只在第一次迭代中起作用（但效果很好 - 数字改变然后警告（'gooood-goood'）显示）。

有趣的是，循环继续并且vars'选项'和'select'按照它们应该分配，甚至第二个按钮的alert（）显示，表示事件onclick工作，但第二行中的标签保持为零，并且那里实际上并没有模拟onclick事件。这段代码似乎拒绝在循环的所有循环中工作，但第一个。

最终目标 - 模拟用户并在javascript上完全解决不是必需的。我在循环中有一个动态变化的参数，我认为Selenium IDE可能是我的答案，但我需要它使用一些逻辑并在循环中更改参数。

这里有两个列表：脚本和html应该执行脚本。

<table>
  <tr>
    <td id="c10">
      <select name="c0">
        <option value="0" selected>0</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
        <option value="6">6</option>
        <option value="7">7</option>
        <option value="8">8</option>
        <option value="9">9</option>
      </select>
    </td>
    <td id="c11">
      <select name="c1">
        <option value="0" selected>0</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
        <option value="6">6</option>
        <option value="7">7</option>
        <option value="8">8</option>
        <option value="9">9</option>
      </select>
    </td>
    <td id="c12">
      <input value="OK" type="button" onclick="alert('gooood-goood')" />
    </td>
  </tr>
  <tr>
    <td id="c20">
      <select name="c0">
        <option value="0" selected>0</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
        <option value="6">6</option>
        <option value="7">7</option>
        <option value="8">8</option>
        <option value="9">9</option>
      </select>
    </td>
    <td id="c21">
      <select name="c1">
        <option value="0" selected>0</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
        <option value="6">6</option>
        <option value="7">7</optiaon>
        <option value="8">8</option>
        <option value="9">9</option>
      </select>
    </td>
    <td id="c22">
      <input value="OK" type="button" onclick="alert('gooood-goood')" />
    </td>
  </tr>
</table>

然后脚本

function foo() {
  alert('inside');

  var comb = rand(10, 99) + '', row = 1, col = 0;

  for (; row <= 2; row++) {
    for (; col <= 1; col++) {
      var select = '#c' + row + col + ' select[name=c' + col + ']';
      var option = "#c" + row + col + " select option[value=" + comb[col] + "]";

      $(select).change(function () {
        $(option).prop('selected', true);
      });

      $(select).change();

      if (col == 1) {
        var i = col + 1;
        $('#c' + row + i + ' input').click();
      }
    }

    col = 0;
    comb = rand(10, 99);
  }
}

$(function () {
  document.getElementById('done').onclick = foo;
});


function rand(min, max) { // Generate a random integer
  if (max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
  } else {
    return Math.floor(Math.random() * (min + 1));
  }
}

更新

我不知道我做了什么，但它现在正在运作。相同的代码：/

Answer 1

在您的代码中：

>  var option = "#c"+ row + col + " select option[value=" + comb[col] + "]";
> 
>  $(select).change(function(){
> 
>    $(option).prop('selected', true);
>  });

更改函数中的变量选项具有外部选项变量的闭包，因此该值将是选项时的值。循环结束，即（comb[col]设置为6）：

 "#c21 select option[value=6]";

顺便说一下，从 comb 中选择数字的方式将在不允许通过索引访问字符串字符的浏览器中失败（至少某些版本的IE）并且意味着 rand 函数也可以只返回0到9之间的数字。

您可以使用以下内容解决第一个问题：

comb.substring(1,2)

或

 comb.charAt(1)

使你正在做的事情变得更加明显。

您是否考虑过只是获取表单控件并迭代这些控件并独立于表结构？这会非常简单。

Answer 2

好的，我刚刚意识到。第一次迭代后comb = rand(10, 99);变为不是字符串。

只需修复comb = rand(10, 99) + '';

即可

在几个元素上模仿onclick事件

2 个答案: