如何在中创建增量和递减值的按钮？

Question

对于字段平衡，我想创建两个按钮，加法和减号按钮。此字段显示分销商的当前余额。所以现在，为了在文本框中添加一些值，我想在文本框的一侧添加按钮，这样我就可以在该字段中增加值。此外，我希望将递增的值添加到现有(旧)值中。我知道网上有很多例子，但是没有为我工作，所以请帮帮我。

我的平衡场：

    <tr>
            <td>Balance</td>
            <td><?php echo form_input('balance', set_value('balance', $user->balance)); ?></td>
    </tr>

加薪扣减按钮：

​

<link href="<?php echo site_url('css/bootstrap.css'); ?>" rel="stylesheet">
            <link href="<?php echo site_url('css/add.css'); ?>" rel="stylesheet">
            <link href="<?php echo site_url('css/datepicker.css'); ?>" rel="stylesheet">





            <link href="<?php echo site_url('css/jquery-ui.css'); ?>" rel="stylesheet">
            <link href="<?php echo site_url('css/jquery-ui.min.css'); ?>" rel="stylesheet">
            <link href="<?php echo site_url('css/jquery-ui.structure.css'); ?>" rel="stylesheet">
            <link href="<?php echo site_url('css/jquery-ui.structure.min.css'); ?>" rel="stylesheet">
            <link href="<?php echo site_url('css/jquery-ui.theme.css'); ?>" rel="stylesheet">
            <link href="<?php echo site_url('css/jquery-ui.theme.min.css'); ?>" rel="stylesheet">



            <link href="<?php echo site_url('/bower_components/metisMenu/dist/metisMenu.min.css'); ?>" rel="stylesheet">

            <link href="<?php echo site_url('/dist/css/timeline.css'); ?>" rel="stylesheet">

            <link href="<?php echo site_url('/dist/css/sb-admin-2.css'); ?>" rel="stylesheet">

            <link href="<?php echo site_url('/bower_components/morrisjs/morris.css'); ?>" rel="stylesheet">

            <link href="<?php echo site_url('bower_components/font-awesome/css/font-awesome.min.css'); ?>" rel="stylesheet">

            <link href="<?php echo site_url('bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css'); ?>" rel="stylesheet">

            <link href="<?php echo site_url('bower_components/metisMenu/dist/metisMenu.min.css'); ?>" rel="stylesheet">

            <link href="<?php echo site_url('bower_components/datatables-responsive/css/dataTables.responsive.css'); ?>" rel="stylesheet">

            <link href="<?php echo site_url('/bower_components/bootstrap/dist/css/bootstrap.min.css'); ?>" rel="stylesheet">


            <link rel="shortcut icon" href="<?php echo site_url('img/favicon.ico'); ?>" type="image/x-icon" />


            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>




                        <script>
                        $(function()
                        {
                            $('#spinnerInput').spinner();
                        });
                        </script>








            <script src="http://code.jquery.com/jquery-latest.js"></script>
            <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>



        <script src="<?php echo site_url('js/bootstrap.min.js'); ?>"></script>
        <script src="<?php echo site_url('css/external/jquery/jquery.js'); ?>"></script>
        <script src="<?php echo site_url('bower_components/metisMenu/dist/metisMenu.min.js'); ?>"></script>
        <script src="<?php echo site_url('/bower_components/datatables/media/js/jquery.dataTables.min.js'); ?>"></script>
        <script src="<?php echo site_url('/bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.min.js'); ?>"></script>
        <script src="<?php echo site_url('/dist/js/sb-admin-2.js'); ?>"></script>






            <script src="<?php echo site_url('bower_components/bootstrap/dist/js/bootstrap.min.js');?>"></script>

            <script src="<?php echo site_url('bower_components/metisMenu/dist/metisMenu.min.js');?>"></script>


            <script src="<?php echo site_url('bower_components/raphael/raphael-min.js');?>"></script>

            <script src="<?php echo site_url('js/morris-data.js');?>"></script>

            <script src="<?php echo site_url('dist/js/sb-admin-2.js');?>"></script> 




          <script>
            $(document).ready(function() {
                $('#dataTables-example').DataTable({
                        responsive: true
                });
            });
            </script>

Answer 1

您需要添加jquery和css文件以及所需的图像。请从下面的网址下载文件和图片。

JS - http://code.jquery.com/ui/1.9.2/jquery-ui.js

CSS - http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css

图片-

256x240.png

256x240.png