1

我正在制作一个 phonegap 应用程序，并且我有一个需要一些用户输入的页面。如果选中了一个复选框（报告），那么我想禁用除下一个检查按钮之外的所有用户输入。

<div data-role="main" class="ui-content" id="MainBody">
  <ul id="topBtns">
    <li id="reportedLabel">
      <label id="reportedLabel">
        <input type="checkbox" id="reported" class="hidden" onchange="document.getElementById('1a').disabled = this.checked;document.getElementById('1b').disabled = this.checked;document.getElementById('comment1').disabled = this.checked;document.getElementById('photo1').disabled = this.checked;">
        Already reported
      </label>
    </li>
    <li id="back">
      <button id="back" data-icon="arrow-l">
        Check 0
      </button>
    </li>
  </ul>
  <br>
  <h2 class="checkNum">Check #1</h2>
  <p class="check">Some Text</p>
  <label><input type="radio" id="1a" name="1">Answer1</label>
  <label><input type="radio" id="1b" name="1">Answer2</label>
  <br>
  <textarea rows="4" placeholder="Type your comments here" id="comment1"></textarea>
  <br>
  <button id="photo1" onclick="insert_photo()">
    Insert Photo
  </button>
  <button id="btnCont1" onClick="location.href='index.html#Q2'">Continue</button>
</div> <!-- Main -->

当我在这个问题的代码片段上运行代码时它可以工作，但是当我通过 phonegap 应用程序运行它或者甚至只是运行 HTML 文件时，只有插入照片按钮被禁用，但其他 3 个元素被忽略。这让我认为它与 Jquery Mobile 有关，但我不确定是否完全诚实。

任何帮助深表感谢

4

1 回答 1

0

虽然我无法在您的环境中进行测试，但可能与您使用this. 为了更好地检查您的问题，我将 onchange 事件的代码转移到了一个函数中。我遇到的第一个问题this是没有传递给函数。然后我最初调用了类似的函数disableControls(this.checked)，并使用参数来获取值。它有效，但让我认为这可能是你的问题。最好的办法是您也尝试使用 document.getElementById 获取检查值。看看我的示例并在您的环境中重现，看看它是否有效。如果没有，您可以使用 console.log 元素来调试问题所在。

function disableControls() {		
    var checked = document.getElementById('reported').checked;
    document.getElementById('1a').disabled = checked;
    document.getElementById('1b').disabled = checked;
    document.getElementById('comment1').disabled = checked;
    document.getElementById('photo1').disabled = checked;	
}
<html >
<meta charset="utf-8">
<body>
<div data-role="main" class="ui-content" id="MainBody">
	<ul id="topBtns">
		<li id="reportedLabel">
			<label id="reportedLabel">
				<input type="checkbox" id="reported" class="hidden" onchange="disableControls();">
				Already reported
			</label>
		</li>
		<li id="back"><button id="back" data-icon="arrow-l">Check 0</button></li>
	</ul>
	<br>
	<h2 class="checkNum">Check #1</h2>
	<p class="check">Some Text</p>
	<label><input type="radio" id="1a" name="1">Answer1</label>
	<label><input type="radio" id="1b" name="1">Answer2</label>
	<br>
	<textarea rows="4" placeholder="Type your comments here" id="comment1"></textarea>
	<br>
	<button id="photo1" onclick="insert_photo()">Insert Photo</button>
	<button id="btnCont1" onClick="location.href='index.html#Q2'">Continue</button>
</div> <!-- Main -->

</body>
</html>

于 2018-08-17T22:19:11.113 回答