Onclick事件处理程序给出一个值[JS]

时间:2018-09-12 12:10:17

标签: javascript dynamic onclick boolean eventhandler

什么样的可能性使onclick事件处理程序给出一个值(真,假),所以它可以由另一个函数进行逻辑决策(如果单击按钮,则可以这样做,如果不这样做)。

我的代码:

function toggleBoolean(){
document.getElementById("click").onclick=function(){
return true;}
}

1 个答案:

答案 0 :(得分:0)

我已经为您创建了一个小示例,希望(它)能够满足您的需求。

/**
 * Performs an operation based on the provided parameter.
 */
function toggleBoolean(checked) {
  // Find the div element in the DOM and exit if it can't be found.
  const
    statusIndicator = document.getElementById('theBoolean');
  if (statusIndicator === null) {
    return;
  }
  
  // When the checked parameter is true, add the is-active CSS class
  // to the div element; otherwise remove the class.
  if (checked){
    statusIndicator.classList.add('is-active');
  } else {
    statusIndicator.classList.remove('is-active');
  }
}

/**
 * This method handles the event dispatched when the button to
 * toggle the boolean is clicked.
 */
function onButtonClicked(event) {
  // Call the method, pass the value true along to the method.
  toggleBoolean(true);
}

// Get the element from the DOM.
const
  button = document.getElementById('myButton');
// Make sure the element exists before assigning something
// to it or your code will crash.
if (button !== null) {
  // Add an event listener for the click event.
  button.addEventListener('click', onButtonClicked);
}

// Set the boolean value to false.
toggleBoolean(false);
.status-indicator {
  background-color: red;
  height: 40px;
  margin-top: 10px;
  width: 40px;
}

.status-indicator.is-active {
  background-color: blue;
}
<button id="myButton" type="button">Click me</button>

<div id="theBoolean" class="status-indicator"></div>