Question

我希望变量foo在以下代码中的那些区域中替换我当前使用'+ foo +'的某些区域。

我认为我做错了。

基本上我想做的是当＃22243有.attr（'aria-hidden'）=='false'将该数字放入url（url：'https://someurl.vom/22243?client_id=x&client_secret=y'），然后修改容器的div为'＃container22243'。如果div＃49805有.attr（'aria-hidden'）=='false'将该数字放入url（url：'https://someurl.vom/49805?client_id=x&client_secret=y'）并将容器的div修改为'＃ container49805' 。

我希望我已经清楚地解释了这一点。

感谢您的帮助肖恩

       $(window).load(function(){

            $( "button, img" ).click(function() {
             console.log('arrow clicked');

            //url with a var
            $('#22243').each(function() {
                    if ($(this).attr('aria-hidden') == 'false') {
                        var foo = '22243';
                        console.log(foo);


            //Brewery section
            $.ajax({
                type: 'GET',
                url: 'https://someurl.vom/'+foo+'?client_id=x&client_secret=y',
                success: function(response) {
                    //  console.log(response);
                    //the loop  
                    response.response.brewery.checkins.items.forEach(function(checkin) {
                        console.log(checkin);
                        var res = {
                            venues: [],
                        }
                        if (checkin.venue.venue_id) {
                            $('#container'+foo+'').append('<div id="beer"> <p>' + checkin.beer.beer_name + '<br />' + 'Brewery: ' + checkin.brewery.brewery_name + '</br>' + 'Venue: ' + checkin.venue.venue_name + '</br>' + 'Address: ' + checkin.venue.location.venue_address + '</br>' + 'State: ' + checkin.venue.location.venue_state + '</br>' + 'Country: ' + checkin.venue.location.venue_country + '</p></div>');

                            var markers = [];

                            var contentString ='<div id="content">' + '<div id="siteNotice">' + '</div>' + '<h1 id="firstHeading" class="firstHeading">' + checkin.beer.beer_name + '</h1>' + '<div id="bodyContent">' + '<p>Brewery: ' + checkin.brewery.brewery_name + ',</br>' + 'Venue: ' + checkin.venue.venue_name + ',<br />' + 'Address: ' + checkin.venue.location.venue_address + ',</br>' + 'State: ' + checkin.venue.location.venue_state + ',</br>' + 'Country: ' + checkin.venue.location.venue_country + '</p>' +  '</div>' + '</div>';
                            var marker = new google.maps.Marker({
                                position: {
                                    lat: checkin.venue.location.lat,
                                    lng: checkin.venue.location.lng,
                                },
                                title: checkin.beer.beer_name,
                                animation: google.maps.Animation.DROP,
                                map: map,
                            });

                            markers.push(marker);

                            function setMapOnAll(map) {
                            for (var i = 0; i < markers.length; i++) {
                            markers[i].setMap(map);
                            }
                            }

                            var infowindow = new google.maps.InfoWindow({
                                content: contentString
                            });
                            marker.addListener('click', InfoWindow);

                            function InfoWindow() {
                                infowindow.open(map, marker);
                            }

                            function deleteMarkers() {
                            clearMarkers();
                            markers = [];
                            }

                        } else {}
                    })
                },
            });
                  } else {
                   }
               });
            //url with a var - End


            });

            });

HTML

<!DOCTYPE html>
    <html>
    <head>
      <title>My Now Amazing Webpage</title>
      <meta charset="UTF-8">
      <link href="style.css" rel='stylesheet'>
      <link rel="stylesheet" href="css/reset.css">
      <link rel="stylesheet" href="css/main.css">
      <link href="./slick/slick.css" rel="stylesheet" type="text/css">
      <link href="./slick/slick-theme.css" rel="stylesheet" type="text/css">
      <style type="text/css">

         * {
           box-sizing: border-box;
         }

         .slider {
             width: 50%;
             margin: 100px auto;
         }

         .slick-slide {
           margin: 0px 20px;
         }

         .slick-slide img {
           width: 100%;
         }

         .slick-prev:before,
         .slick-next:before {
             color: black;
         }
      </style>
    </head>
    <body>
      <section class="slider-nav slider">
        <div><img alt="Alphabet City Brewing Company" src="images/alphabet-city-logo.png" width="200px"></div>
        <div><img alt="Big Alice Brewing" src="images/big-alice.png" width="200px"></div>
      </section>
      <section class="slider-for slider">
        <div id="22243">
          <div id="brewery-content">
            <h1>Alphabet City Brewing Company</h1>
            https://untappd.com/w/alphabet-city-brewing-company/22243
            <div id="container22243"></div>
          </div>
        </div>

        <div id="49805">
          <div id="brewery-content">
            <h1>Big Alice Brewing</h1>
            https://untappd.com/w/big-alice-brewing-company/49805
            <div id="container49805"></div>
          </div>
        </div>
    </section>

      <script src="https://code.jquery.com/jquery-2.2.0.min.js" type="text/javascript">
      </script> 
      <script charset="utf-8" src="./slick/slick.js" type="text/javascript">
      </script>   
      <script src='js/script-test.js'>
      </script>
    </body>
    </html>

我想用一个被调用的变量来改变URL的一部分

0 个答案: