Skip to content

Instantly share code, notes, and snippets.

@greatghoul

greatghoul/index.html

Created May 25, 2017 10:41
Show Gist options
  • Save greatghoul/90075307c194a097acc106af2152b9cc to your computer and use it in GitHub Desktop.
Save greatghoul/90075307c194a097acc106af2152b9cc to your computer and use it in GitHub Desktop.
Download ZIP
JS Bin // source https://jsbin.com/luhoho
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<style>
table { text-align: center; }
.name { display: inline-block; width: 60px; background-color: #ccc; height: 16px;}
</style>
<script>
function fill(button) {
document.getElementById(button.className).innerHTML = button.innerHTML;
}
function call() {
var nameA = document.getElementById('a').innerHTML;
var nameB = document.getElementById('b').innerHTML;
var result = '';
var formulas = [
['爸爸', '爸爸', '爷爷'],
['爸爸', '妈妈', '奶奶'],
['妈妈', '爸爸', '外公'],
['妈妈', '爸爸', '外婆'],
];
for (var i = 0; i < formulas.length; i++) {
console.log(i);
if (nameA == formulas[i][0] && nameB == formulas[i][1]) {
document.getElementById('result').innerHTML = formulas[i][2];
break;
}
}
}
</script>
</head>
<body>
<table border="1" width="100%">
<tr>
<td>
<button class="a" onclick="fill(this)">爸爸</button>
<button class="a" onclick="fill(this)">妈妈</button>
</td>
<td>
<button class="b" onclick="fill(this)">爸爸</button>
<button class="b" onclick="fill(this)">妈妈</button>
</td>
</tr>
<tr>
<td colspan="2">
<span class="name" id="a"></span>
的
<span class="name" id="b"></span>
<button onclick="call()">叫</button>
<span class="name" id="result"></span>
</td>
</tr>
</table>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment