使用JavaScript更改按钮文本在Opera（11.11）中不适用于< input type =" submit" />元素。为什么？ [英] Changing button text with JavaScript doesn't work in Opera (11.11) for <input type="submit" /> elements. Why?
问题描述
< input type =这样的元素，为什么改变按钮文本在Opera 11.11中不起作用？ submitvalue =Asdasdid =blahblah_button/>
？ （并没有在早期版本中尝试过）。
我尝试过使用jQuery和纯粹JavaScript，但都没有成功。
这是我试过的jQuery代码：
$（'＃blahblah_button'）。val（'夸夸其谈'）;
这就是纯的JS代码：
document.getElementById（'blahblah_button'）。value ='Blah-blah';
为什么它们都不能在Opera 11.11中使用 > 它在IE，Chrome和FF中工作，令我惊讶的是它在Opera中无法使用。
我必须提及它也适用于Opera这样的按钮标签：
< button id =test_buttononclick =$（this ）.text（'Blahblah'）;>一些文字< / button>
感谢您提前给出答案！
编辑I.（0:40）
我忘了提及在修改后查询按钮的值给出结果它看起来工作正常，这意味着它改变了JS DOM中的结构，但不会适当地重新显示可见的按钮。
这是你用可以尝试这种行为：
http：// jsbin .com / inuxix / 1 / edit
<！DOCTYPE html PUBLIC - // W3C // DTD XHTML 1.0 Transitional // ENhttp://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">
< html xmlns =http://www.w3.org/1999/xhtmllang =huxml：lang =hu>
< head>
< meta http-equiv =content-typecontent =text / html; charset = utf-8/>
< title>更改按钮文字< / title>
< script src =http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.jstype =text / javascript>< / script>
< / head>
< body>
< p>按钮标记 - WORKING
< button onclick =$（this）.text（'Blahblah_1'）; id =test_button> Button_text（button_tag）< / button>
< / p>
< p>输入标签（类型：提交） - 不工作
< input onclick =$（this）.val（'Blahblah_2'）; type =submitvalue =Submit_textid =blahblah_submit_type/>
< / p>
< p>输入标签（type：button） - WORKING
< input onclick =$（this）.val（'Blahblah_3'）; type =buttonvalue =Button_textid =blahblah_button_type/>
< / p>
< p>
< button onclick =alert（$（'＃blahblah_submit_type'）。val（））; id =val_button>获取blahblah_submit_type的值< / button>
< / p>
< / body>
< / html>
编辑II。 （4:41）
但是我也不得不提及它对输入元素使用按钮类型 - 所以我补充了我的上面的代码用这样的元素。我也标记了哪些类型和哪些类型不起作用。
编辑III。
与此同时，我测试了它，并且它在Opera中不起作用<= 11.11 ，但这个bug已经在 Opera 11.50 虽然。
歌剧。我不确定是什么原因导致它，但一个简单的测试页面重命名按钮不会触发任何问题，但在@ Darin的jsfiddle.net示例错误确实出现。
<这似乎是一个重绘错误。我注意到按钮的宽度更改为匹配新标签，但实际标签不会更改。此外，从页面移开并返回，会显示新标签，而不是旧标签。
我做了一个Google快速搜索，找不到其他人
以下是我找到的解决方法：
$ （ '#blahblah_button'）VAL（ '有'）;
$（'＃blahblah_button'）。get（0）.outerHTML = $（'＃blahblah_button'）。get（0）.outerHTML;
也许有人可以找到一个更清晰的解决方法，理想情况是内置于jQuery的 val （）方法。但最好的解决方案显然是让Opera来修复这个bug。您应该向他们发送一封关于它的电子邮件。
Why is that changing a button text doesn't work in Opera 11.11 for elements like
<input type="submit" value="Asdasd" id="blahblah_button" />
? (Didn't try it in earlier versions yet.)
I tried it with jQuery and with "pure" JavaScript too, none of them worked.
This is the jQuery code I tried:
$('#blahblah_button').val('Blah-blah');
and this is the "pure" JS-code:
document.getElementById('blahblah_button').value = 'Blah-blah';
Why is that none of them worked in Opera 11.11?
It DOES work in IE, Chrome and FF, it surprises me that it doesn't work in Opera.
I have to mention that it DOES work for button tags like this in Opera too:
<button id="test_button" onclick="$(this).text('Blahblah');">Some text</button>
Thanks for your answers in advance!
EDIT I. (0:40)
I forgot to mention that querying the button's value after the modification gives the result that it seems to work fine, which means it changes the structure in JS DOM, but doesn't rerender the visible button appropriately.
This is the example code with which you can try this behaviour:
http://jsbin.com/inuxix/1/edit
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="hu" xml:lang="hu">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Changing button text</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<p>Button tag - WORKING
<button onclick="$(this).text('Blahblah_1');" id="test_button">Button_text (button_tag)</button>
</p>
<p>Input tag (type: submit) - NOT working
<input onclick="$(this).val('Blahblah_2');" type="submit" value="Submit_text" id="blahblah_submit_type" />
</p>
<p>Input tag (type: button) - WORKING
<input onclick="$(this).val('Blahblah_3');" type="button" value="Button_text" id="blahblah_button_type" />
</p>
<p>
<button onclick="alert($('#blahblah_submit_type').val());" id="val_button">Getting blahblah_submit_type's value</button>
</p>
</body>
</html>
EDIT II. (4:41)
But I also have to mention that it DOES work for input elements with "button" type - so I complemented my code above with an element like this. I also marked which types do and which don't work.
EDIT III.
In the meantime, I tested it, and it doesn't work in Opera <= 11.11, but this bug has been fixed in Opera 11.50 though.
This is a bug in Opera. I'm not sure what causes it, but a simple test page that renames the button does not trigger any issues, however on @Darin's jsfiddle.net example the bug does appear.
It appears to be a redraw bug. I noticed the width of the button changes to match the new label, but the actual label does not change. Also, shifting away from the page and going back, shows the new label instead of the old one.
I did a quick google and could not find anyone else who's come across it.
Here is a workaround that I found:
$('#blahblah_button').val('there');
$('#blahblah_button').get(0).outerHTML = $('#blahblah_button').get(0).outerHTML;
Perhaps someone can find a cleaner workaround, ideally one that's built into jQuery's val() method. But the best solution is obviously for Opera to fix the bug. You should send them an email about it.
这篇关于使用JavaScript更改按钮文本在Opera（11.11）中不适用于< input type =" submit" />元素。为什么？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
