0

私が考案した電卓には厄介なバグがあります。何らかの理由で、Chrome はボタンをクリックすると「予期しないトークン }」と表示します。これは意味がありません。JavaScript と CSS、および onclick イベント (未定義の JavaScript 関数がないことを確認するため) を一時的に削除することで、問題を HTMl に絞り込むことができたと思います。これは完璧です。また、+、*、=、および - ボタンは正常に機能するため、onclick イベントである必要があります。なにが問題ですか?

PS: 電卓は明らかに完全に機能していません。まだ始まったばかりです。

<head>
    <style>
      button{
        background-color: #4D4447;
        border: 2px solid #191842;
        color: #BABACC;
      }
      button:hover{
        background-color: #6F6DC2;
        color: #FDFCFF;
      }
    </style>    
    <script>
    var num = ""
      function tonumber (val){
          num=num+val
        document.getElementById("answer").innerHTML=num
      }
    </script>
</head>
<body>
      <table id="calc">
      <caption id="answer">0</caption>
      <tr>
      <td><button onclick="tonumber("1")">1</button></td>
      <td><button onclick="tonumber("2")">2</button></td>
      <td><button onclick="tonumber("3")">3</button></td>
      </tr>
      This goes on with 4,5,6,7,8 and 9. Same code, just with different numbers.
      <tr>
      <td><button onclick="tonumber("0")">0</button></td>
       <td><button>+</button></td>
       <td><button>-</button></td>
       </tr>
       <tr>
        <td><button>*</button></td>
       <td><button>/</button></td>
       <td><button>=</button></td>
       </tr>
       </table>

</body>
4

2 に答える 2

3

問題は、引用符が適切にラップされず、関数を引数に登録する式を完了することができないことonclickです。したがって、JS エラーが発生しています。

これを試してください: function の引数の前後の一重引用符に注意してくださいtonumber

   <td><button onclick="tonumber('1')">1</button></td>
  <td><button onclick="tonumber('2')">2</button></td>
  <td><button onclick="tonumber('3')">3</button></td>

デモ

<button onclick="tonumber("1")">1</button>
                           ^---------------------------------
于 2013-06-05T20:55:35.310 に答える
-1
Ext.define('MyCalculaterApp.view.Main', {
    extend: 'Ext.Panel',
    xtype: 'main',
    requires: [
    'Ext.TitleBar',
    'Ext.field.Text'
    ],
    config: {
        right: '40%',
        left: '40%',
        top: '20%',
        bottom: '20%',
        margin:'10px',
        padding:'10px',
        defaults: {
            flex:'1'           
        },   
        items: [
        {
            xtype:'fieldset',
            title:'...Calculater...',
            flex:'1',
            instructions:'screen touch calculater'
        },
        {            
            xtype: 'textfield',
            id: 'screen',    
            name: 'screen',
            style:'font-size:20px;',
            height: '15%'
        },
        {
            layout: 'hbox',
            defaults:{
                flex:'1',
                margin:'5px'
            },
            items: [
            {
                xtype: 'button',
                text: '1',
                name: 'one'
            },
            {
                xtype: 'button',
                text: '2',
                name: 'two'
            },
            {
                xtype: 'button',
                text: '3',
                name: 'three'
            }
            ]
        },
        {
            layout: 'hbox',
            defaults:{
                flex:'1',
                margin:'5px'
            },
            items: [
            {
                xtype: 'button',
                text: '4',
                name: 'four'
            },
            {
                xtype: 'button',
                text: '5',
                name: 'five'
            },
            {
                xtype: 'button',
                text: '6',
                name: 'six'
            }
            ]
        },
        {
            layout: 'hbox',
            defaults:{
                flex:'1'  ,
                margin:'5px'
            },
            items: [
            {
                xtype: 'button',
                text: '7',
                name: 'seven'
            },
            {
                xtype: 'button',
                text: '8',
                name: 'eight'
            },
            {
                xtype: 'button',
                text: '9',
                name: 'nine'
            }
            ]
        },
        {
            layout: 'hbox',
            defaults:{
                flex:'1'  ,
                margin:'5px'
            },
            items: [
            {
                xtype: 'button',
                text: '0',
                name: 'zero'
            },
            {
                xtype: 'button',
                text: '+',
                name: 'add'
            },
            {
                xtype: 'button',
                text: '-',
                name: 'sub'
            }
            ]
        },
        {
            layout: 'hbox', 
            defaults:{
                flex:'1'  ,
                margin:'5px'
            },
            items: [
            {
                xtype: 'button',
                text: '*',
                name: 'mul'
            },
            {
                xtype: 'button',
                text: '/',
                name: 'div'
            },
            {
                xtype: 'button',
                text: '=',
                name: 'equal'
            },
            ]
        }
        ]
    }
});
于 2013-06-05T20:57:58.487 に答える