blocks|key|1425055|text|由于按钮值是一个属性，因此需要在jquery中使用.attr()方法。这应该就行了|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1425056|<script+type="text/javascript">
++++$(document).ready(function()+{
++++++++$('.my_button').click(function()+{
++++++++++++alert($(this).attr("value"));
++++++++});
++++});
</script>|code-block|syntax|javascript|1425057|你也可以使用attr来设置属性，更多信息in+the+docs。|offset|length|1425058|这只适用于JQuery+1.6%2B。请参阅后现代对旧版本的回答。|1425059|entityMap|0|LINK|mutability|MUTABLE|url|http://docs.jquery.com/Attributes/attr^0|0|0|K|B|0|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|V|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|W|8|@]|9|@$I|X|J|Y|1|Z]]|A|$]]|$1|K|3|L|5|6|7|10|8|@]|9|@]|A|$]]|$1|M|3|-4|5|6|7|11|8|@]|9|@]|A|$]]]|N|$O|$5|P|Q|R|A|$S|T]]]]

<p>As a button value is an attribute you need to use the .attr() method in jquery. This should do it</p>

<pre><code>&lt;script type="text/javascript"&gt;
    $(document).ready(function() {
        $('.my_button').click(function() {
            alert($(this).attr("value"));
        });
    });
&lt;/script&gt;
</code></pre>

<p>You can also use attr to set attributes, more info <a href="http://docs.jquery.com/Attributes/attr" rel="noreferrer">in the docs</a>.</p>

<p>This only works in JQuery 1.6+. See postpostmodern's answer for older versions.</p>


blocks|key|1640274|text|按钮没有value属性。要获取按钮的文本，请尝试：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1640275|$('.my_button').click(function()+{
+++++alert($(this).html());
});|code-block|syntax|javascript|1640276|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>Button does not have a value attribute. To get the text of button try:</p>

<pre><code>$('.my_button').click(function() {
     alert($(this).html());
});
</code></pre>


blocks|key|1425230|text|您还可以使用新的HTML5自定义数据属性。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1425231|<script+type="text/javascript">
$(document).ready(function()+{
++++$('.my_button').click(function()+{
++++++++alert($(this).attr('data-value'));
++++});
});
</script>

<button+class="my_button"+name="buttonName"+data-value="buttonValue">Button+Label</button>|code-block|syntax|javascript|1425232|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>You can also use the new HTML5 custom data- attributes.</p>

<pre><code>&lt;script type="text/javascript"&gt;
$(document).ready(function() {
    $('.my_button').click(function() {
        alert($(this).attr('data-value'));
    });
});
&lt;/script&gt;

&lt;button class="my_button" name="buttonName" data-value="buttonValue"&gt;Button Label&lt;/button&gt;
</code></pre>


blocks|key|1425308|text|为按钮提供一个value属性，然后使用以下命令检索值：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1425309|$("button").click(function(){
++var+value=$(this).attr("value");
});|code-block|syntax|javascript|1425310|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>Give the buttons a value attribute and then retrieve the values using this:</p>

<pre><code>$("button").click(function(){
  var value=$(this).attr("value");
});
</code></pre>


blocks|key|1640122|text|对你的按钮试试这个：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1640123|<input+type="button"+class="my_button"+name="buttonName"+value="buttonValue"+/>|code-block|syntax|javascript|1640124|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>try this for your button:</p>

<pre><code>&lt;input type="button" class="my_button" name="buttonName" value="buttonValue" /&gt;
</code></pre>


blocks|key|1425166|text|受后现代的启发，我做了这个，让.val()在我的javascript代码中工作：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1425167|jQuery(function($)+{

++++if($.browser.msie)+{
++++++++//+Fixes+a+know+issue,+that+buttons+value+is+overwritten+with+the+text

++++++++//+Someone+with+more+jQuery+experience+can+probably+tell+me
++++++++//+how+not+to+polute+jQuery.fn+here:
++++++++jQuery.fn._orig_val+=+jQuery.fn.val

++++++++jQuery.fn.val+=+function(value)+{
++++++++++++var+elem+=+$(this);
++++++++++++var+html
++++++++++++if(elem.attr('type')+==+'button')+{
++++++++++++++++//+if+button,+hide+button+text+while+getting+val()
++++++++++++++++html+=+elem.html()
++++++++++++++++elem.html('')
++++++++++++}
++++++++++++//+Use+original+function
++++++++++++var+result+=+elem._orig_val(value);
++++++++++++if(elem.attr('type')+==+'button')+{
++++++++++++++++elem.html(html)
++++++++++++}
++++++++++++return+result;
++++++++}
++++}
})|code-block|syntax|javascript|1425168|然而，它并没有解决后现代所解决的提交问题。也许这可以包含在后现代的解决方案中：http://gist.github.com/251287|offset|length|1425169|entityMap|0|LINK|mutability|MUTABLE|url|http://gist.github.com/251287^0|0|0|13|T|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|U|8|@]|9|@$I|V|J|W|1|X]]|A|$]]|$1|K|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|L|$M|$5|N|O|P|A|$Q|R]]]]

<p>Inspired by postpostmodern I have made this, to make .val() work throughout my javascript code:</p>

<pre><code>jQuery(function($) {

    if($.browser.msie) {
        // Fixes a know issue, that buttons value is overwritten with the text

        // Someone with more jQuery experience can probably tell me
        // how not to polute jQuery.fn here:
        jQuery.fn._orig_val = jQuery.fn.val

        jQuery.fn.val = function(value) {
            var elem = $(this);
            var html
            if(elem.attr('type') == 'button') {
                // if button, hide button text while getting val()
                html = elem.html()
                elem.html('')
            }
            // Use original function
            var result = elem._orig_val(value);
            if(elem.attr('type') == 'button') {
                elem.html(html)
            }
            return result;
        }
    }
})
</code></pre>

<p>It does however, not solve the submit problem, solved by postpostmodern. Perhaps this could be included in postpostmodern's solution here: <a href="http://gist.github.com/251287" rel="nofollow noreferrer">http://gist.github.com/251287</a></p>


blocks|key|1425080|text|如果您想要获取值属性(buttonValue)，那么我将使用：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1425081|<script+type="text/javascript">
++++$(document).ready(function()+{
++++++++$('.my_button').click(function()+{
++++++++++++alert($(this).attr('value'));
++++++++});
++++});
</script>|code-block|syntax|javascript|1425082|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>if you want to get the value attribute (buttonValue) then I'd use:</p>

<pre><code>&lt;script type="text/javascript"&gt;
    $(document).ready(function() {
        $('.my_button').click(function() {
            alert($(this).attr('value'));
        });
    });
&lt;/script&gt;
</code></pre>


blocks|key|1640304|text|+<!DOCTYPE+html>
+<html>
+<head>
++<script+src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">
+</script>
+<script>
+$(document).ready(function(){
+++$("#hide").click(function(){
++++$("p").toggle();

++++var+x+=+$("#hide").text();

++++++if(x=="Hide"){
++++++$("button").html("show");

++++++}
+++++else+
+++++{
+++++$("button").html("Hide");

++++++}

+++++++});

+++});

++</script>
++</head>
++<body>

+<p>If+you+click+on+the+"Hide"+button,+I+will+disappear.</p>

+<button+id="hide">Hide</button>



+</body>
+</html>|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1640305|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code> &lt;!DOCTYPE html&gt;
 &lt;html&gt;
 &lt;head&gt;
  &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"&gt;
 &lt;/script&gt;
 &lt;script&gt;
 $(document).ready(function(){
   $("#hide").click(function(){
    $("p").toggle();

    var x = $("#hide").text();

      if(x=="Hide"){
      $("button").html("show");

      }
     else 
     {
     $("button").html("Hide");

      }

       });

   });

  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;

 &lt;p&gt;If you click on the "Hide" button, I will disappear.&lt;/p&gt;

 &lt;button id="hide"&gt;Hide&lt;/button&gt;



 &lt;/body&gt;
 &lt;/html&gt;
</code></pre>


<p>A simple one, I'm trying to retrieve the value attribute of a button when its been pressed using jQuery, here's what I have:</p>

<pre><code>&lt;script type="text/javascript"&gt;
    $(document).ready(function() {
        $('.my_button').click(function() {
            alert($(this).val());
        });
    });
&lt;/script&gt;

&lt;button class="my_button" name="buttonName" value="buttonValue"&gt;
    Button Label&lt;/button&gt;
</code></pre>

<p>In Firefox my alert displays 'buttonValue' which is great but in IE7 it displays 'Button Label'.</p>

<p>What jQuery should I use to always get the button's value?  Or should I be using a different approach?</p>

<p>Many thanks.</p>

<p>ANSWER:
I'm now using</p>

<pre><code>&lt;input class="my_button" type="image" src="whatever.png" value="buttonValue" /&gt;
</code></pre>


Retrieve Button value with jQuery

jQuery

HTML5

一个简单的例子，当按钮被jQuery按下时，我尝试检索按钮的值属性，下面是我得到的结果：<script type="text/javascript">    $(document).ready(function() {        $('.my_button').click(function() {            alert($(this).val());        });    }

问使用jQuery检索按钮值
EN

回答 8

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用jQuery检索按钮值EN

回答 8

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用jQuery检索按钮值
EN