javascript 返回 JS 函数的值并将其用作输入按钮的值

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/16167675/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 03:33:00  来源:igfitidea点击:

Return the value of a JS function and use it as the value for an input button

htmljavascript

提问by Julian

I want to set a JavaScript function which returns a string, and that string to be used as a value for a button. Something like this:

我想设置一个返回字符串的 JavaScript 函数,并将该字符串用作按钮的值。像这样的东西:

function test(){
 x = "some text";
 return x;
}

I want to use this function in a input element in the value attribute. Something like this:

我想在 value 属性的输入元素中使用这个函数。像这样的东西:

<input type="button" id="s1" value="test()" />

Unfortunatly the button doesn't show "some text" but "test()" on the button. How can i fix this?

不幸的是,按钮上没有显示“一些文本”而是“test()”。我怎样才能解决这个问题?

回答by Sudhir Bastakoti

you could do:

你可以这样做:

<input type="button" id="s1" value="" />
<script type="text/javascript">
 var elem = document.getElementById("s1");
 elem.value = "some text";
</script>

回答by Johannes Fahrenkrug

You can also do it in an elegant way by using custom data attributes.

您还可以使用自定义数据属性以优雅的方式完成此操作。

See a JSFiddle demo here: http://jsfiddle.net/NJ5sK/

在此处查看 JSFiddle 演示:http: //jsfiddle.net/NJ5sK/

Basically, you mark your input elements with the name of the function that should be called to return its value. Then you grab all the elements that have the data-value-functionattribute, run the function and assign the value.

基本上,您使用应该调用以返回其值的函数的名称来标记输入元素。然后获取所有具有该data-value-function属性的元素,运行该函数并分配值。

HTML:

HTML:

<input type="text" data-value-function="cheese" />
<input type="text" data-value-function="animal" />

JS:

JS:

window.cheese = function() {
    return "Limburger";
}

window.animal = function() {
    return "Cat";
}

var elements = document.querySelectorAll('*[data-value-function]');
for (var i = 0; i < elements.length; i++) {
    var valueFunctionName = elements[i].getAttribute('data-value-function');
    elements[i].value = window[valueFunctionName]();
}

Enjoy!

享受!

回答by KernelPanik

The correct way to set the value of the button would be to use the HTML DOM, or a framework like JQuery. This also has a JSBin Demo.

设置按钮值的正确方法是使用 HTML DOM 或像 JQuery 这样的框架。这也有一个JSBin Demo

For example,

例如,

HTML- Runs function testwhen document loads.

HTML-test在文档加载时运行函数。

<body onload = "test()">
  <input type="button" id="s1" value="" />
</body>

JavaScript -

JavaScript -

function test(){
 x = "some text";
 document.getElementById("s1").value =x;
}

View JSBin Demo

查看 JSBin 演示

回答by rkm

value attribute for html button accepts only text. see here.

html 按钮的 value 属性只接受文本。看到这里

What I understand from your question is you want a html button whose value should be set by a javascript function. you can achieve this the other way around.

我从您的问题中了解到您想要一个 html 按钮,其值应由 javascript 函数设置。你可以反过来实现这一点。

Get button element using document.getElementByIdand set the valueinside the test()

使用获取按钮元素document.getElementById并设置其value内部test()

you code should looks like this:

你的代码应该是这样的:

<input type="button" id="s1"/>

<script>
   function test(){
      document.getElementById('s1').value ='some text'; //s1 is the id of html button
   };
   test(); //dont forget to call function
</script>

回答by Silvertiger

function test(){
    x = "some text";
    document.getElementById('s1').value = x;
}