我正在尝试创建3个按钮，并使用javascript，如果单击按钮1，则会将“单击按钮”文本更改为“按下按钮1”
按钮2和3相同！ 如果按下按钮3，文本颜色将变为绿色
然而，我似乎无法让它发挥作用！任何帮助将不胜感激
这是我的当前代码：
<!DOCTYPE html>
<html>
<head>
<title>Button</title>
</head>
<body>
<script type="text/javascript">
function changeText() {
var b1 = document.getElementById('b1');
var b2 = document.getElementById('b2');
var b3 = document.getElementById('b3');
if(b1.onclick="changeText();") {
document.getElementById('pText').innerHTML = "You pressed button 1";
}
if(b2.onlick="changeText();") {
document.getElementById('pText').innerHTML = "You pressed Button 2";
}
}
</script>
<input type="button" value="Button 1" id="b1" onclick="changeText();"/>
<input type="button" value="Button 2" id="b2" onclick="changeText();"/>
<input type="button" value="Button 3" id="b3" onclick="changeText();"/>
<p id="pText">Click on a Button</p>
</body>
</html>
答案 0 :(得分：12)
你可以试试这个：
<!DOCTYPE html>
<html>
<head>
<title>Button</title>
</head>
<body>
<script type="text/javascript">
function changeText(value) {
document.getElementById('pText').innerHTML = "You pressed " + value;
}
</script>
<input type="button" value="Button 1" id="b1" onclick="changeText(this.value);"/>
<input type="button" value="Button 2" id="b2" onclick="changeText(this.value);"/>
<input type="button" value="Button 3" id="b3" onclick="changeText(this.value);"/>
<p id="pText">Click on a Button</p>
</body>
</html>
这里你要做的就是当你点击按钮时，正在调用onlick();函数，其中包含你刚刚点击的按钮元素的值。所有changeText();函数现在要做的就是编辑要编辑的元素的innerHTML。直接
希望这有帮助。
更新代码：（反映您更新的参数）
<!DOCTYPE html>
<html>
<head>
<title>Button</title>
</head>
<body>
<script type="text/javascript">
function changeText(value) {
document.getElementById('pText').innerHTML = "You pressed " + value;
if(value == "Button 3")
{
document.getElementById('pText').setAttribute('style', 'color: green');}
}
</script>
<input type="button" value="Button 1" id="b1" onclick="changeText(this.value);"/>
<input type="button" value="Button 2" id="b2" onclick="changeText(this.value);"/>
<input type="button" value="Button 3" id="b3" onclick="changeText(this.value);"/>
<p id="pText">Click on a Button</p>
</body>
</html>
答案 1 :(得分：1)
试试这个：
<html>
<head>
<title>Button</title>
</head>
<body>
<script type="text/javascript">
function changeText(text) {
document.getElementById('pText').innerHTML=text;
}
</script>
<input type="button" value="Button 1" id="b1" onclick="changeText('You pressed Button 1');"/>
<input type="button" value="Button 2" id="b2" onclick="changeText('You pressed Button 2');"/>
<input type="button" value="Button 3" id="b3" onclick="changeText('You pressed Button 3');"/>
<p id="pText">Click on a Button</p>
</body>
</html>
答案 2 :(得分：1)
您的代码非常完美。但问题是if循环执行顺序如此之快，以至于您无法看到第一个文本何时转换为第二个文本。 尝试在两次通话之间插入提醒。
答案 3 :(得分：0)
你很近，但没有雪茄。
要正确识别您点击的按钮，您应该使用函数调用发送var margin = {top: 20, right: 20, bottom: 20, left: 40},
width = 960 - margin.left - margin.right,
height = 500 - margin.top - margin.bottom;
var x = d3.scale.linear()
.domain([0, data[data.length -1]])
.range([0, width]);
var y = d3.scale.linear()
.domain([0, 100])
.range([height, 0]);
var line = d3.svg.line()
.x(function(d, i) {
var dt = new Date();
var time = dt.getHours() + ":" + dt.getMinutes() + ":" + dt.getSeconds();
return dt.getSeconds();
})
.y(function(d, i) { console.log("D is " + d+ "Y is " + y(d));return y(d); });
var svg = d3.select("body").append("svg")
.attr("width", width + margin.left + margin.right)
.attr("height", height + margin.top + margin.bottom)
.append("g")
.attr("transform", "translate(" + margin.left + "," + margin.top + ")");
svg.append("defs").append("clipPath")
.attr("id", "clip")
.append("rect")
.attr("width", width)
.attr("height", height);
svg.append("g")
.attr("class", "x axis")
.attr("transform", "translate(0," + y(0) + ")")
.call(d3.svg.axis().scale(x).orient("bottom"));
svg.append("g")
.attr("class", "y axis")
.attr("transform", "translate(0," + x(0)+")")
.call(d3.svg.axis().scale(y).orient("left"));
var path = svg.append("g")
.attr("clip-path", "url(#clip)")
.append("path")
.datum(data)
.attr("class", "line")
.attr("d", line);
redraw();
function redraw() {
path
.attr("d", line)
.attr("transform", null)
.transition()
.duration(500)
.ease("linear")
.attr("transform", "translate(" + x(-1) + ",0)")
.each("end", tick);
data.shift();
}
，这样您就可以获得对被点击对象的引用。比较if语句中的this将无法正常工作，因为它是函数指针，而不是字符串。
尝试类似：
onclick你的<input type="button" value="Button 1" id="b1" onclick="changeText(this);"/>
现在应该是这样的。您可以使用此示例，但您必须自己弄清楚其余部分。这应该指向正确的方向。
changeText()