Skip to content

Instantly share code, notes, and snippets.

@greatghoul
Created May 25, 2017 10:22
Show Gist options
  • Save greatghoul/0a0823ac9218b6badc14689685d612e5 to your computer and use it in GitHub Desktop.
Save greatghoul/0a0823ac9218b6badc14689685d612e5 to your computer and use it in GitHub Desktop.
JS Bin // source https://jsbin.com/luhoho
<!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(group, name) {
document.getElementById(group).innerHTML = name;
}
function call() {
var nameA = document.getElementById('a').innerHTML;
var nameB = document.getElementById('b').innerHTML;
var result = '';
if (nameA == '爸爸' && nameB == '爸爸') {
result = '爷爷';
} else if (nameA == '爸爸' && nameB == '妈妈') {
result = '奶奶';
} else if (nameA == '妈妈' && nameB == '爸爸') {
result = '外公';
} else if (nameA == '妈妈' && nameB == '妈妈') {
result = '外婆';
}
document.getElementById('result').innerHTML = result;
}
</script>
</head>
<body>
<table border="1" width="100%">
<tr>
<td>
<button class="a" onclick="fill('a', '爸爸')">爸爸</button>
<button class="a" onclick="fill('a', '妈妈')">妈妈</button>
</td>
<td>
<button class="b" onclick="fill('b', '爸爸')">爸爸</button>
<button class="b" onclick="fill('b', '妈妈')">妈妈</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