Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> Javascript wybor opcji i wyswietlanie jednej z nich po wyborze
dyksior
post
Post #1





Grupa: Zarejestrowani
Postów: 3
Pomógł: 0
Dołączył: 21.11.2014

Ostrzeżenie: (0%)
-----


Witam,
mam taki o to skrypcik:

Kod
(function($) {
    $(function() {
        var car_maker = $('#car-maker');
        var car_model = $('#car-model');
        var car_engine = $('#car-engine');

        car_maker.change(function() {
            car_maker_change();
        });

        car_model.change(function() {
            car_model_change();
        });

        car_engine.change(function() {
            car_engine_change();
        })

        function car_maker_change() {
            var maker_id = car_maker.find('option:selected').val();

            var data = {
                'action': 'mm_get_models',
                'maker_id': maker_id
            };

            $.post(ajax_object.ajax_url, data, function(response) {
                results = $.parseJSON(response);

                clear_model_dropdown();
                clear_engine_dropdown();

                car_model.append($('<option value="0">Wybierz...</option>'));
                $.each(results.models, function() {
                    car_model.append($("<option/>").val(this.slug).text(this.name));
                });
            });
        }

        function car_model_change() {
            var model_slug = car_model.find('option:selected').val();

            var data = {
                'action': 'mm_get_engines',
                'model_name': model_slug
            };

            $.post(ajax_object.ajax_url, data, function(response) {
                results = $.parseJSON(response);

                clear_engine_dropdown();

                car_engine.append($('<option value="0">Wybierz...</option>'));
                $.each(results.engines, function() {
                    car_engine.append($("<option/>").val(this.post_id).text(this.title));
                });
            });
        }

        function car_engine_change() {
            var engine_id = car_engine.find('option:selected').val();
            console.log(engine_id);

            var data = {
                'action': 'mm_get_engine_image',
                'engine_id': engine_id
            };

            $.post(ajax_object.ajax_url, data, function(response) {
                results = $.parseJSON(response);

                $('.power-chart').animate(
                    {
                        //'right': '60%',
                        'opacity': 0
                    },
                    250,
                    function() {
                        $(this).find('img').attr('src', results.image_url);
                        $(this).animate(
                            {
                                //'right': '50%',
                                'opacity': 1
                            },
                            750
                        );
                    }
                )
            });
        }

        function clear_model_dropdown() {
            car_model.find('option').remove().end();
        }

        function clear_engine_dropdown() {
            car_engine.find('option').remove().end();
        }
    });
})(jQuery);


jest to skrypt napisany pod wordpressa(prawdopodobnie korzysta z bazydanych) dziala na zasadzie opcji wyboru. Mamy option value i po wyborze jednej wyswietla on wlasnie ta wybrana. Niestety nie chce uzywac wordpressa, tylko chce to wstawic do czystego htmla. Jestem zielony w js, prosze pomoc jak go przeksztalcic, lub jesli ktos wie gdzie takowy znajdzie proszeo o informacje.
Z gory dziekuje,
pozdrawiam.
Go to the top of the page
+Quote Post
kamilo818
post
Post #2





Grupa: Zarejestrowani
Postów: 250
Pomógł: 11
Dołączył: 20.01.2014

Ostrzeżenie: (0%)
-----


Rozumiem że chcesz po wybraniu option z selecta wyswietlić gdzies value?

  1. <select>
  2. <option value="1">1</option>
  3. <option value="2">2</option>
  4. <option value="3">3</option>
  5. </select>
  6.  
  7. <script>
  8. $('select').change(function(){
  9. alert($(this).val());
  10. });
  11. </script>
Go to the top of the page
+Quote Post
dyksior
post
Post #3





Grupa: Zarejestrowani
Postów: 3
Pomógł: 0
Dołączył: 21.11.2014

Ostrzeżenie: (0%)
-----


Tak, dokladnie o to chodzi (IMG:style_emoticons/default/wink.gif) . Tylko teraz jak zrobic zeby do kazdego value przypisac pewna tresc, ktora po wyborze owego bedzie gdzies wyswietlana?

Ten post edytował dyksior 22.11.2014, 11:04:39
Go to the top of the page
+Quote Post
tzm
post
Post #4





Grupa: Zarejestrowani
Postów: 675
Pomógł: 58
Dołączył: 17.12.2013

Ostrzeżenie: (10%)
X----


http://jsfiddle.net/ambsxvhz/
Go to the top of the page
+Quote Post
kamilo818
post
Post #5





Grupa: Zarejestrowani
Postów: 250
Pomógł: 11
Dołączył: 20.01.2014

Ostrzeżenie: (0%)
-----


Dokładnie tak jak Ci napisałem.

  1. $('select').change(function(){
  2. alert($(this).val());
  3. });

zamiast alert możesz wpisać treść do elementu stony np div
  1. $('div.box').html($(this).val());
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Aktualny czas: 21.10.2025 - 11:39