jquery运行函数前检查字段值

Check value of fields before running function in jquery

本文关键字：字段 检查 运行 函数 jquery      更新时间：2023-09-26

我基本上想在页面上有一个脚本，当它发现两个名为"lng"answers"lat"的页面上有一个值时，显示一个地图。

这意味着如果页面上有带值的字段，那么它将尝试显示一个映射，但如果没有，则不显示。

这是我到目前为止的代码:http://jsfiddle.net/spadez/xJhmk/3/

function mapDisplay() {
    var latval = $('input[id=lat]').val();
    var lngval = $('input[id=lng]').val();
    var mapOptions = {
        zoom: 8,
        center: new google.maps.LatLng(latval, lngval),
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        disableDefaultUI: true,
        scrollwheel: false,
        draggable: false
    };
    var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
}

$(function () {
    mapDisplay();
});

我不是很擅长jquery，但这是我试过的，没有工作:

if (latval !=NULL && lngval != NULL)){
...my code
}

有更多知识的人能帮助我理解为什么这种方法不起作用吗?

试试这个

if ( !isNaN(latval) && !isNaN(lngval)) {

基本上它检查两个输入是否是数字，只有当为真才会进入if条件

也

var latval = $('input[id=lat]').val();
var lngval = $('input[id=lng]').val();

可以安全地写成

var latval = $('#lat').val(),
    lngval = $('#lng').val();

您可以为将显示地图的输入连接change事件

function mapDisplay() {
    var latval = $('#lat').val(),
        lngval = $('#lng').val();
      if (!isNaN(parseFloat(latval)) && !isNaN(parseFloat(lngval))) {
        var mapOptions = {
            zoom: 8,
            center: new google.maps.LatLng(latval, lngval),
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            disableDefaultUI: true,
            scrollwheel: false,
            draggable: false
        };
        var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
        $('#map_canvas').removeClass('hidden');
    } else {
        $('#map_canvas').addClass('hidden');
    }
}

$(function () {
    $('input').on('change', mapDisplay).trigger('change');
});

检查小提琴

你可以这样做:

var latval = $('#lat').val();
var lngval = $('#lng').val();
if ($.trim(latval) != '' && $.trim(lngval) != '') {
    // You code
  • 不需要这样做，input[id=lat]，你可以直接调用它，如$('#lat')
  • 使用$.trim()删除字符串开头和结尾的空格。

你的代码是正确的:你只需要在你的CSS中添加一行，以便查看地图:

添加
display:block; in #map_canvas

像这样:

#map_canvas {
    display:block;
    height: 150px;
    width: 300px;
}

此外，你可以通过使用jquery设置这个显示属性来改变它的显示设置(取决于变量是否有值)。

默认文本框返回字符串值。对于空文本框，可以勾选

if(latval=='' && lngval==''){alert('blank');}
else{your code;}

从文本框返回的值不是NULL它只是一个空字符串，所以你应该检查值是否为空

if(latval !="" && lngval !=""){
Your code
}

，如果您想只指定数字，请尝试添加

$.isNumeric()
 if($.isNumeric(latval) && $.isNumeric(lngval )){
    Your code
    }

可以访问如下变量:

var lat = jQuery.trim($('#lat').val());
var lng = jQuery.trim($('#lng).val());

并检查字段是否为空

if(lat == '' && lng == '') {
    //do code
} else {
   //show the map
   $("#mapId").show();
}

当你检查纬度/经度时，我也会检查它们是否为数字。

function checkValues() {
    var valueOK = false;
    if($.isNumeric($('#lat').val())) { 
         if($.isNumeric($('#lng').val())) valueOK = true;
    }
    return valueOK;
}
$(function () {
    if(checkValues) {
         mapDisplay();
    }
}
相关文章：