页面加载的 Keyup 替代方案

Question

I have the following JS but the last bit only runs on keyup , I want this to run on page load, please can you help solve this as I am sure its only a quick fix -

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script>
    jQuery.ajax({
        url: "https://geoip-db.com/jsonp",
        jsonpCallback: "callback",
        dataType: "jsonp",
        success: function (location) {
            var country = location.country_name;
            var region = location.state;
            var city = location.city;
            var lat = location.latitude;
            var long = location.longitude;

            // add classes to display location info on page
            //City
            jQuery(".cityText").text(city);

            //Region
            jQuery(".regionText").text(region);

            //Country
            jQuery(".countryText").text(country);
            $("#countryfield").val(country);
        }
    });



    $(document).ready(function () {
        $("#countryfield").keyup(function () {
            $("#lp-pom-button-13").css("display", this.value == "United Kingdom" ? "block" : "none");
        });
    });
</script>

Answer 1

You can trigger the keyup event manually after adding the event handler.

$("#countryfield").keyup(function () {
    $("#lp-pom-button-13").css("display", this.value == "United Kingdom" ? "block" : "none");
}).keyup();

Answer 2

Do you want to execute that line ONLY on page load or on page load AND key up? What the "page load" means? When the HTML document loads or when the HTTP (AJAX) response receives?

I Think you need below code that changes CSS when HTTP response receives or use change it manually:

 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script>

function fixCss()
{
    $("#lp-pom-button-13").css("display", this.value == "United Kingdom" ? "block" : "none");
}

   jQuery.ajax({
    url: "https://geoip-db.com/jsonp",
    jsonpCallback: "callback",
    dataType: "jsonp",
    success: function( location ) {
      var country = location.country_name;
      var region = location.state;
      var city = location.city;
      var lat = location.latitude;
      var long = location.longitude;
 
      // add classes to display location info on page
      //City
      jQuery(".cityText").text(city);
 
      //Region
      jQuery(".regionText").text(region);
 
      //Country
      jQuery(".countryText").text(country);
      $("#countryfield").val(country);

      fixCss();
    }
  }); 
  
  

      $(document).ready(function () {
        $("#countryfield").keyup(function () {
           fixCss();
        });
    });
    </script>