Question

我有一个当前已禁用的按钮。一旦对表单中的输入进行了任何更改。我想启用它......

    $(function () {


Highcharts.theme = {
   colors: ["#0085e1"],
   chart: {
       backgroundColor: "transparent"
   }, 

   tooltip: {
  backgroundColor: '#0085e1',
  style: {
     color: '#ffffff'
  }
   },



};
(function(H) {
H.wrap(H.Tick.prototype, 'render', function(p, index, old, opacity) {
    var tick = this,
        d,
        size = 0.25; // = 75%, 0.5 = 50%, 0.75 = 25% etc.
    p.call(this, index, old, opacity);

    if(tick.gridLine && this.axis.isXAxis) {

        d = tick.gridLine.d.split(' '); // get default path
        console.log(d[5]);
        d[2] = ( d[5] - d[2] ) * size + tick.axis.chart.plotTop; // modify path - don't forget about plotTop
        tick.gridLine.attr({
            d: d // apply new path
        });
    }

});
})(Highcharts)

Highcharts.setOptions(Highcharts.theme);        
Highcharts.setOptions({lang: {  thousandsSep: ','}});

$('#homechart').highcharts({
     chart: {
        type: 'spline',

    },
    title: {
        text: '',
        x: -20 //center
    },       
    legend: {
        enable: false
    },
    xAxis: {
        categories: ['2011', '2012', '2013', '2014', '2015', '2016'],
        gridLineWidth: 0,
        gridLineColor: '#e5f2fd',
         minorTickWidth: 0
    },
    yAxis: {
          title: {
            text: null
        },
        labels: {
          enabled: false
        },
        gridLineColor: 'transparent'
    },
    tooltip: {
        formatter:function(){
            var nosheets = this.y.toLocaleString();
                return  nosheets + ' sheets';
        },
        borderRadius: 20,
        style: {
          padding: 5    
        }
    },

    plotOptions: {
        spline: {

              marker: {
                radius: 5,
                lineColor: '#0085e1',
                lineWidth: 1
            }
        }
    },
    series: [{
        name: 'Sheets',
        data: [0, 1000, 835000, 5100000, 15300000, 33400000]
    }]
});
});

var text = $("text");
text.each(function(index, domElement) {
        var $element = $(domElement);

        if ($element.text() === "Highcharts.com") {
            $element.hide();            }


    }); 

  });

这似乎不起作用。我究竟做错了什么？（使用.jsx语法）

Answer 1

在input上附加change和<form>两个事件。

检查以下示例。

$(document).ready(function() {
  $('#form').on('input change', function() {
    $('#checkout').attr('disabled', false);
  });
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="form">
  Text:
  <input type="text" class="input-text" />
  <br>Radio:
  <input type="radio">
  <br>Checkbox:
  <input type="checkbox">
  <br>Select:
  <select name="" id="">
    <br>
    <option value="">1</option>
    <option value="">2</option>
    <option value="">3</option>
  </select>
  <button type="submit" className="btn" id="checkout" disabled>Checkout</button>
</form>

Answer 2

由于你正在使用jQuery，只需使用attr()函数（和类选择器来进行更有效的查找）：

$('input.input-text').on('change', (event) => {
    event.preventDefault();
    $('#checkout').attr('disabled', false);
});

jsFiddle Demo

请注意：change事件仅在.input-text模糊时触发。您可以考虑使用onkeyup（或类似）。

任何表单更改时启用按钮

2 个答案: