1

我有个问题。我希望我的 javascript 文件查找用户是否选择了“否”，他们不想要屏蔽，如果选择了“弧”，那么它应该勾选复选框 1。同样适用于“否”和“Ely”勾选复选框4。“No”和“Spec”也勾选了 checkbox7。但是，如果他们选择“否”和“任何”，他们可以选择任何内容。我该怎么做呢。

HTML 代码：

<html>
<head>
<script type="text/javascript" src="myJavascript.js"></script>
</head>
<body>

 <select id="likeShield" onchange="showTicks(this)">
 <option value="select1">Select</option>
 <option value="yesShield">Yes</option>
 <option value="noShield">No</option>
 </select>

 <select id="chooseShield">
 <option value="select1">Select</option>
 <option value="arc">Arcane</option>
 <option value="ely">Elysian</option>
 <option value="spec">Spectral</option>
 <option value="anylist">Choose any</option>
 </select>

 <table border = "1">
 <tr>
     <th> tickbox </th>
     <th> shield parts </th>
     <th> description </th>
     <th> cost </th>
 </tr>
 <tr>
          <td><input type="checkbox" id="cb1"></td>
      <td> arc sigil </td>
      <td> Large magic part </td>
      <td> 5m </td>
 </tr>
 <tr>
          <td><input type="checkbox" id="cb2"></td>
      <td> arc shield </td>
      <td> A extremely powerful magic shield </td>
      <td> 60m </td>
 </tr>
 <tr>
          <td><input type="checkbox" id="cb3"></td>
      <td> arc special item </td>
      <td> special element </td>
      <td> 10m </td>
 </tr>
 <tr>
          <td><input type="checkbox" id="cb4"></td>
      <td> elysian sigil  </td>
      <td> A sigil found by dragons </td>
      <td> 50m </td>
  </tr>   
  <tr>
          <td><input type="checkbox" id="cb5"></td>
      <td> elysian shield </td>
      <td> A extremely powerful ranging shield </td>
      <td> 40m </td>
  </tr>   
  <tr>
          <td><input type="checkbox" id="cb6"></td>
      <td> elysian special item </td>
      <td> A special attack attached to shield </td>
      <td> 25m </td>
  </tr>
  <tr>
          <td><input type="checkbox" id="cb7"></td>
      <td> spectral sigil  </td>
      <td> easily obtainable from goblins </td>
      <td> 4m </td>
  </tr>
  <tr>
          <td><input type="checkbox" id="cb8"></td>
      <td> spectral shield </td>
      <td> Impressive stats </td>
      <td> 15m </td>
  </tr>
  <tr>
          <td><input type="checkbox" id="cb9"></td>
      <td> spectral special item </td>
      <td> Does double damage </td>
      <td> 30m </td>
  </tr>
  </table>
  </body>
  </html>

我认为它是一个 IF 语句，但我不知道如何实现它。

谁能帮我解决这个问题？

谢谢

拍。

编辑：

我的 javascript if 语句：

function showTicks(what)
{
if (what.value == ("noShield") && ("arc")) {
  if (what.value == ("noShield") && ("ely")) {
    if (what.value == ("noShield") && ("spec")) {
    document.getElementById("cb1").checked=true;
    document.getElementById("cb4").checked=true;
    document.getElementById("cb7").checked=true;
    }
else
  document.getElementById("cb7").checked=false;
  }
else
document.getElementById("cb4").checked=false;
 }
else
document.getElementById("cb1").checked=false;
}
4

4 回答 4

0

使用jQuery：

<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script type="text/javascript">
$("#likeShield").change(function() {
   if ($("#likeShield").val() == "yesShield") {
       if ($("#chooseShield").val() == "arc") {
          $("#cb1").prop("checked", true);
       } // etc
   }
})
</script>

这会将处理程序附加到选择change事件likeShield，因此每当用户更改该下拉列表中的选择时，它都会运行附加函数。

于 2012-11-16T15:18:50.550 回答
0

我会使用 jQuery。结帐工作演示。

在更改事件读取选定值时，比较并设置 checkox。

$(".conf").change(function() {
    tickBoxes();
})

function tickBoxes() {

    var likeShield = $("#likeShield").val();
    var chooseShield = $("#chooseShield").val();

    if (likeShield == 'noShield' && chooseShield == 'arc') {
        $("#cb1").prop('checked', true);
    }
}
于 2012-11-16T15:37:50.927 回答
0

但是要让它工作，你需要在你的 html 中使用一个表单，请参阅链接：http: //jsbin.com/oyuxah/2/edit

var likeShield = document.getElementById('likeShield');
var chooseShield = document.getElementById('chooseShield');

function checkAll(){

  if(likeShield.value=="noShield" && chooseShield.value=="arc"){
     document.getElementById('cb1').checked =true;
     document.getElementById('cb2').checked =false;
     document.getElementById('cb3').checked =false;
     document.getElementById('cb4').checked =false;
     document.getElementById('cb5').checked =false;
     document.getElementById('cb6').checked =false;
     document.getElementById('cb7').checked =false;
  }

  if(likeShield.value=="noShield" && chooseShield.value=="ely"){
     document.getElementById('cb1').checked =false;
     document.getElementById('cb2').checked =false;
     document.getElementById('cb3').checked =false;
     document.getElementById('cb4').checked =true;
     document.getElementById('cb5').checked =false;
     document.getElementById('cb6').checked =false;
     document.getElementById('cb7').checked =false;
  }

  if(likeShield.value=="noShield" && chooseShield.value=="spec"){
     document.getElementById('cb1').checked =false;
     document.getElementById('cb2').checked =false;
     document.getElementById('cb3').checked =false;
     document.getElementById('cb4').checked =false;
     document.getElementById('cb5').checked =false;
     document.getElementById('cb6').checked =false;
     document.getElementById('cb7').checked =true;
   }
  if(likeShield.value=="noShield" && chooseShield.value=="anylist"){
     document.getElementById('cb1').checked =false;
     document.getElementById('cb2').checked =false;
     document.getElementById('cb3').checked =false;
     document.getElementById('cb4').checked =false;
     document.getElementById('cb5').checked =false;
     document.getElementById('cb6').checked =false;
     document.getElementById('cb7').checked =false;
   }

 }
于 2012-11-16T16:09:08.567 回答
-1

您应该创建一个能够修改/检查 DOM 的 Javascript 脚本（内联或非内联）。

你的答案在这里：http ://docs.jquery.com/How_jQuery_Works

于 2012-11-16T15:20:18.237 回答