简体   繁体   English

如何调用通过单击HTML按钮将文本输入到只读文本框中的函数?

[英]How do I call a function that enters text into a read-only text-box by clicking an HTML button?

I am trying to write a short piece of html code that, given two initial amounts, attempts to find the number greater than or equal to the first that wholly divides the second given amount. 我正在尝试编写一小段html代码,给定两个初始数量,试图找到大于或等于第一个整数的数字,该数字将第二个给定数量完全除。 The code tries to divide the numbers, and if it is unsuccessful, adds 1 to the first number and tries to divide again, etc... 代码尝试对数字进行除法,如果不成功,则将第一个数字加1,然后再次尝试除法,依此类推...

I want the code to return the value that does wholly divide the second number AND the answer to the division (with some plain text appearing around it). 我希望代码返回将第二个数字完全除的值以及除的答案(周围有一些纯文本)。

Added to this, or at least I'd like there to be, is that upon clicking one of 5 different buttons a multiplication operation is performed on the first given number, it is rounded up to the nearest whole number, and THEN the function attempts to divide this into the second given number. 除此之外,或者至少我想要的是,在单击5个不同的按钮之一时,对第一个给定的数字执行乘法运算,将其舍入到最接近的整数,然后函数尝试将其划分为第二个给定的数字。

It's difficult to explain exactly what I want without showing you the code I have so far, so here it is: 如果不向您展示我到目前为止的代码,很难确切地解释我想要的东西,所以这里是:


<html>

<head>

<b>Rounded Commodity Pricing:</b><br>

</head>

<script language="Javascript">

var currency;

function setCurrency(val) {
 var currency = val;
}

function finddivid(marketprice,tradevalue) { 
 var KWDex = 0.281955
 var GBPex = 0.625907
 var USDex = 1
 var CADex = 0.998727
 var EURex = 0.784594

if 
  (currency == "KWD") 
  var currencyMarketprice = Math.ceil(marketprice*KWDex);
else if
  (currency == "GBP")
  var currencyMarketprice = Math.ceil(marketprice*GBPex);
else if 
  (currency == "USD") 
  var currencyMarketprice = Math.ceil(marketprice*USDex);
else if 
  (currency == "CAD") 
  var currencyMarketprice = Math.ceil(marketprice*CADex);
else if 
  (currency == "EUR") 
  var currencyMarketprice = Math.ceil(marketprice*EURex);

if (tradevalue % currencyMarketprice == 0)
  return ("tonnage = " + tradevalue / currencyMarketprice + " mt, and price = " + currencyMarketprice +" " +currency +" per mt");
else
  {for (var counter = currencyMarketprice+1; counter<(currencyMarketprice*2); counter++) {
    if (tradevalue % counter == 0)
     return ("tonnage = " + tradevalue / counter + " mt, and price = " + counter +" " +currency +" per mt");}}
}

</script>

</head>

<p>Select currency:
<input type="button" value="KWD" OnClick="setCurrency('KWD')">
<input type="button" value="USD" OnClick="setCurrency('USD')">
<input type="button" value="GBP" OnClick="setCurrency('GBP')">
<input type="button" value="EUR" OnClick="setCurrency('EUR')">
<input type="button" value="CAD" OnClick="setCurrency('CAD')">

<P>Enter today's price of commodity in USD: <input name="mktprc" input type="number"><br><p>
<P>Enter value of trade: <input name="trdval" input type="number">

<input type="button" value="Calculate" OnClick="document.getElementById('showMeArea').value=finddivid(document.getElementById('mktprc'),document.getElementById('trdval')));">

<p>
<br><br>

<input name="showMeArea" readonly="true" size="100">

</html>

If you run this html in your browser you should see what I am trying to achieve. 如果您在浏览器中运行此html,则应该看到我正在尝试实现的目标。

I've tried for a while to get this to work and I don't know if the error if in the function or it the way I am trying to get the 'return' of the function 'finddivid' into the text box 'showMeArea'... 我已经尝试了一段时间以使其正常工作,但我不知道该函数是否出错,还是我试图将功能“ finddivid”的“返回”输入文本框“ showMeArea”的方式'...

Here are the main problems/features that I need help with: 以下是我需要帮助的主要问题/功能:

  1. I would like to be able to click on one of the 'currency' buttons so that upon clicking, the variable 'currency' is assigned and then used in the function finddivid. 我希望能够单击“货币”按钮之一,以便在单击时分配变量“货币”,然后在函数finddivid中使用它。

(2. This isn't as important right now, but eventually, once this is working, I'd like it so that upon clicking one of the currency buttons, it changes colour, or is highlighted or something so that the user knows which currency rate they are using.) (2.这一点现在不那么重要了,但是最终,一旦它起作用了,我希望它能使它在单击货币按钮之一时改变颜色,突出显示或其他方式,以便用户知道哪个他们使用的货币汇率。)

  1. Upon entering the numbers into the two boxes I would like to click 'Calculate' and have it return what I've written in the function into the 'showMeArea' read-only box at the end of the code. 在两个框中输入数字后,我想单击“计算”,然后将其在代码末尾的代码中将我在函数中编写的内容返回到“ showMeArea”只读框中。

I know I'm probably missing loads of stuff and I might be miles away from success but I am very new to programming (started just a few days ago!) so would like any kind of help that can be offered. 我知道我可能缺少很多东西,可能离成功还很遥远,但是我对编程非常陌生(几天前才开始!),因此希望可以提供任何帮助。

Thanks in advance of your comments. 在此先感谢您的评论。

There are quite a few things wrong with your markup and javascript. 您的标记和javascript有很多错误。 You have unclosed paragraph tags, you set the scope of currency to be global but then define a local variable with the same name when you want to set it (which is why currency is never being set globally), you're using an if/else statement where a switch/case is more appropriate... there's probably a lot more, and the more you learn the more you'll discover. 您有未关闭的段落标签,将货币范围设置为全局,但是在想要设置它时定义一个具有相同名称的局部变量(这就是为什么永远不会全局设置货币的原因),您使用的是if / else语句,其中一个开关/案例更合适...可能有更多,并且您学得越多,就会发现更多。 Having said all that, because it bothered me, here's a modified version of your code which seems to do what you were after : 说了这么多,因为这困扰着我,这是您代码的修改版本,似乎可以满足您的要求:

<html>
<head>

<title>Rounded Commodity Pricing</title>
<script type="text/javascript">

    var currency;
    function setCurrency(val) {
        currency = val;
    }

    function finddivid(marketprice, tradevalue) {
        var KWDex = 0.281955
        var GBPex = 0.625907
        var USDex = 1
        var CADex = 0.998727
        var EURex = 0.784594

        var currencyMarketprice;
        switch (currency) {
            case "KWD":
                currencyMarketprice = Math.ceil(marketprice * KWDex);
                break;
            case "GBP":
                currencyMarketprice = Math.ceil(marketprice * GBPex);
                break;
            case "USD":
                currencyMarketprice = Math.ceil(marketprice * USDex);
                break;
            case "CAD":
                currencyMarketprice = Math.ceil(marketprice * CADex);
                break;
            case "EUR":
                currencyMarketprice = Math.ceil(marketprice * EURex);
                break;

        }

        if (tradevalue % currencyMarketprice == 0)
            return ("tonnage = " + tradevalue / currencyMarketprice + " mt, and price = " + currencyMarketprice + " " + currency + " per mt");
        else {
            for (var counter = currencyMarketprice + 1; counter < (currencyMarketprice * 2); counter++) {
                if (tradevalue % counter == 0)
                    return ("tonnage = " + tradevalue / counter + " mt, and price = " + counter + " " + currency + " per mt");
            } 
        }
    }

    function calculate() {
        var mktprc = document.getElementById('mktprc');
        var trdval = document.getElementById('trdval');
        document.getElementById('showMeArea').value = finddivid(mktprc.value, trdval.value);
    }

</script>
</head>

<p>
    Select currency:
    <input type="button" value="KWD" onclick="setCurrency('KWD')">
    <input type="button" value="USD" onclick="setCurrency('USD')">
    <input type="button" value="GBP" onclick="setCurrency('GBP')">
    <input type="button" value="EUR" onclick="setCurrency('EUR')">
    <input type="button" value="CAD" onclick="setCurrency('CAD')">
</p>

<p>Enter today's price of commodity in USD: <input id="mktprc" input type="number"><p>
<p>Enter value of trade: <input id="trdval" input type="number"></p>
<p><input type="button" value="Calculate" OnClick="calculate();"></p>

<p>
    <input id="showMeArea" readonly="true" size="100">
</p>

</html>

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 如何只允许文本框中的某些文本为只读,同时允许编辑其余文本 - How to make only some text in a text-box read-only while allowing the rest to be edited jQuery:设置只读文本框宽度动态 - Jquery: set read-only text-box width dynamic 我们可以从html文本框中调用Java函数吗? - Can we call a java function from the html text-box? 如何在文本框的末尾连接一些只读文本? - How to concatenate some read-only text at the end of the text box? 在JavaScript中使用单个功能单击其他单选按钮时如何禁用文本框? - How to disable a text-box when clicking on other radio-buttons using a single function in javaScript? JavaScript无法在HTML中执行文本框值 - JavaScript not executing text-box value in HTML 如何验证文本框以仅在Javascript中的onkeypress事件中限制字符的输入 - How can I validate the text-box for restricting the input for characters only in onkeypress event in Javascript 发送文本框 ID 以在 JavaScript 中运行? - Send text-box id to function in JavaScript? 如何使用 HTML 文本框值作为 JavaScript 参数或变量并调用 JavaScript Z86408593C34AF7261F 值框? - How do I use an HTML text box value as a JavaScript parameter or variable and call the JavaScript Function with the text box value? 如何使用 localstorage 将文本存储在表单上并以只读格式返回到另一个表单 - How do I use localstorage to store text on a form and return it on another form in read-only format
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM