简体   繁体   中英

Find and compare elements with matching attribute values in Jquery

How do I go on about selecting elements which has the same attribute values in jquery. And then comparing which of those 2 has a greater value.
Here is what I have so far. The problem that I'm having with this is that I don't really get any output if the first number in the pair is the larger one.

    <script>
    $(function(){
        var j = [];
        $('.loo').each(function(index){
            var grp = $(this).attr('data-x');
            var num = $(this).val();
            var id = $(this).attr('id');

            var pair_val = pair_value(grp);
            var pair_id = pair_identity(id);

            console.log(get_max(num, pair_val, id, pair_id));
        });

        function get_max(num1, num2, id1, id2){
            var decide = 0;
            if(num1 > num2){
                decide = id1;
            }else{
                decide = id2;
            }
            return decide;
        }

        function pair_value(conn){
            var pair = $("input[data-x="+ conn +"]").val(); //my problem is here
            return pair;
        }

        function pair_identity(conn){
            var pair_id = $("input[data-x="+ conn +"]").attr('id'); //my problem is here
            return pair_id;
        }


    });
    </script>

Html:

    <p>
    <input type="text" id="e" name="e" class="loo" value="1" data-x="a">
    </p>
    <p>
    <input type="text" id="f" name="f" class="loo" value="10" data-x="a">
    </p>
    <p>
    <input type="text" id="g" name="g" class="loo" value="37" data-x="b">
    </p>
    <p>
    <input type="text" id="h" name="h" class="loo" value="25" data-x="b">
    </p>
    <p>
    <input type="text" id="i" name="i" class="loo" value="11" data-x="c">
    </p>
    <p>
    <input type="text" id="j" name="j" class="loo" value="12" data-x="c">
    </p>
var highest = new Array();

$('.loo').each(function(){

    if(!highest[$(this).data('x')] || parseInt($(this).val()) > highest[$(this).data('x')] )
        highest[$(this).data('x')] = parseInt($(this).val());          

});

This will loop through all instances of .loo and checks if there is no entry yet or if the current saved value is lower than the current elements value, in that case it will update the array entry.

This will leave you with an array containing all max values for all possible values of data-x

EDIT

excuse me, some syntax errors were present.

EDIT 2

shorter version

http://jsfiddle.net/kkbkb/1/

The problem you're no doubt having is that you are comparing character strings (obtained with .val() ), not numbers. This has a very different behviour - effectively deciding which one is alphabetically before another.

Change this line:

if(num1 > num2){

to

if(parseInt(num1,10) > parseInt(num2,10)){

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM