Jquery将文本框中的值与按钮​​相乘

时间:2017-03-27 03:22:49

标签: javascript jquery

我需要能够获得输入框中的内容并乘以或除以。

我所拥有的是从跨度中获取值,而这不是我想要的

即使我在那里硬编码500也没有用。我知道我错过了一些简单但却无法找到的东西 这就是我对jfiddle jsfiddle

的看法
<?php
$wager="500";
?>

Wager: $<span id="wager"><?php echo $wager; ?></span>
<br> Total
<input type="text" id="count" value="<?php echo $wager; ?>">
<input type="button" data-quantity=".5" value="/&#x00A;2">
<input type="button" data-quantity="2" class="mnozstvi_sleva" value="x&#x00A;2">
<br>

然后这个javascript

$('input:button').click(function() {
$('#count').val($(this).data('quantity') * $('#wager').text());
});

编辑:如果我将值与span相同,它将起作用...我希望能够在boz中键入任何内容并对其进行乘法/除法。

第二次编辑这就是我现在在页面中所拥有的内容并且它无法正常工作

 <html>
 <head>

 </head>
 <body>
 <input type="number" id="count" style="height:25px; width:100px" name="wager" value="" min="00.25" max="25" step="00.25" numberFormat="1.00">
 <input type="button" data-quantity=".5" value="/&#x00A;2">
 <input type="button" data-quantity="2" class="mnozstvi_sleva" value="x&#x00A;2">
<br>

<script>
    $('input:button').click(function(){
    $('#count').val($(this).data('quantity') * $('#count').val());
  });
</script>

</body>
</html>

2 个答案:

答案 0 :(得分:3)

看起来这样有效。确保在页面中元素可用后绑定事件。这是通过在DOM准备好之后执行JavaScript来完成的:

jQuery(document).ready(function($) {
  $('input:button').click(function() {
    var $count = $('#count');
    $count.val( $(this).data('quantity') * $count.val() );
  });
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="number" id="count" style="height:25px; width:100px" name="wager" value="" min="00.25" max="25" step="00.25" numberFormat="1.00">
<input type="button" data-quantity=".5" value="/&#x00A;2">
<input type="button" data-quantity="2" class="mnozstvi_sleva" value="x&#x00A;2">

答案 1 :(得分:1)

使用输入的id获取输入值。

$('input:button').click(function(){
    $('#count').val($(this).data('quantity') * $('#count').val());
});

jsfiddle