Question

我的要求是，一旦我点击复选框，应该禁用保存/更新文本框，当我取消选中并保存/更新文本框时应该启用。在检查期间，latest_file值应为1，在取消选中时，其值应为0。这是我尝试过的代码：

function disableFileName() {
    var latestFile = $("#latestFile").is(":checked");
    if (latestFile) {
        $("#fileName").attr("disabled", "disabled");
    } else {
        $("#fileName").removeAttr("disabled");
    }
}

<table>
    <tr>
        <td>Process the latest file from the feed location  </td>
        <td>
            <s:checkbox property="latestFile" styleId="latestFile" value="1" onclick="disableFileName();" tabindex="5" />
        </td>
    </tr>
    <tr>
        <td>File Name</td>
        <td nowrap="true">
            <s:text property="fileName" styleClass="textbox" styleId="fileName" style="{width:150}" tabindex="6" />
        </td>
    </tr>
</table>

Answer 1

问题中的

javascript会返回disableFileName，#latestFile，#fileName定义的预期结果。要切换value的{{1}}，您可以#latestFile使用$("#latestFile").val(1);，if $("#latestFile").val(1);使用else

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
function disableFileName() {
  
    var latestFile = $("#latestFile").is(":checked");
    if (latestFile) {
        $("#latestFile").val(1);
        $("#fileName").attr("disabled", "disabled");
    } else {
       $("#latestFile").val(0);
        $("#fileName").removeAttr("disabled");
    }
    console.log($("#latestFile").val());
}
</script>
<table>
  <tr>
    <td>Process the latest file from the feed location</td>
    <td>
      <input type="checkbox" property="latestFile" id="latestFile" value="1" onclick="disableFileName();" tabindex="5" />
    </td>
  </tr>
  <tr>
    <td>File Name</td>
    <td nowrap="true">
      <input type="text" property="fileName" class="textbox" id="fileName" style="width:150" tabindex="6" />
    </td>
  </tr>
</table>

＆＃13;

Answer 2

尝试使用prop代替attr来禁用复选框，如下所示：

$("#fileName").prop("disabled", "true");

HTML：

<table>
    <tr>
        <td>Process the latest file from the feed location  </td>
        <td>
            <input type="checkbox" id="latestFile" value="1" onclick="disableFileName();" tabindex="5" />
        </td>
    </tr>
    <tr>
        <td>File Name</td>
        <td nowrap="true">
            <input type="textbox" name="fileName" styleClass="textbox" id="fileName" style="width:150" tabindex="6" />
        </td>
    </tr>
</table>

使用Javascript：

function disableFileName() {
    var latestFile = $("#latestFile").is(":checked");
    if (latestFile) {
        $("#fileName").prop("disabled", "true");
        $("#latestFile").attr("value", "1");
    } else {
        $("#fileName").removeAttr("disabled");
        $("#latestFile").attr("value", "0");
    }
}

以下是演示：JSFiddle Demo

检查后的值未取消选中

2 个答案: