Question

代码：

// if (image.substring(0,7) != "http://" && image.substring(image.length-4) != ".jpg" || ".png")
if (image.substring(0,7) != "http://" && image.substring(image.length-4) != ".jpg" && image.substring(image.length-4) != ".png")
    {
            // do stuff
    }

context：尝试在JavaScript中使用＆amp;＆amp;＆amp;和||运算符，但它没有成功...可能是由于JavaScript返回类似真实和虚假值的事实。

修改
完整代码：

function validateContent(title, rating, link, image, desc)
{
    var flag = true;

    // add more if-statements
    if (title == "")
    {
        $("#inputTitle").css("background-color", "red");
        flag = false;
    }
    if (rating == 0)
    {
        $("#selectRating").css("background-color", "red");
        flag = false;
    }
    if (link.substring(0,26) != "http://www.imdb.com/title/")
    {
        $("#inputLink").css("background-color", "red");
        flag = false;
    }
    // if (image.substring(0,7) != "http://" && image.substring(image.length-4) != ".jpg" || ".png")
    //if (image.substring(0,7) != "http://" && image.substring(image.length-4) != ".jpg" && image.substring(image.length-4) != ".png")
    //if ((image.substring(0,7) != "http://") && (image.substring(image.length-4) != ".jpg") && (image.substring(image.length-4) != ".png"))
    //if (image.substring(0,7) != "http://" && (image.substring(image.length-4) != ".jpg" || image.substr(image.length-4) !=  ".png"))
    //if (/^http:\/\/.*\.(jpg|png)$/.test(image))
    if ((image.substring(0,7) != "http://") && ((image.substring(image.length-4) == true) != ".jpg") && ((image.substring(image.length-4) == true) != ".png"))
    {
            $("#inputImage").css("background-color", "red");
            flag = false;
    }
    return flag;
}

function addContent()
{
    var title = $("#inputTitle").val();
    var rating = $("#selectRating option:selected").index();
    var link = $("#inputLink").val();
    var image = $("#inputImage").val();
    var desc = $("#textareaDescription").val();

    if (validateContent(title, rating, link, image, desc))
    {
        document.forms.formFilmerPHP.submit();
    }
}

function disableOption(pos)
{
    $("#selectRating option:eq(" + pos + ")").prop("disabled", true);
}

function validateInputs(inputType)
{
    // add more cases
    switch(inputType)
    {
        case "title":
            var title = $("#inputTitle").val();
            if (title != "")
                $("#inputTitle").css("background-color", "white");
            break;
        case "rating":
            var rating = $("#selectRating option:selected").index();
            if (rating != 0)
                $("#selectRating").css("background-color", "white");
            break;
        case "link":
            var link = $("#inputLink").val();
            if (link.substring(0,26) == "http://www.imdb.com/title/")
                $("#inputLink").css("background-color", "white");
            break;
    }
}

function preventDefault()
{
    $("#btnAddContent").click(function(event) {event.preventDefault();});
}

function addEventListeners()    // QUESTION: when to use anonymous functions and when not to when adding eventlisteners in order to safely attach functions without invoking them?
{
    // misc eventlisteners
    $("#selectRating").on("focus", function() {disableOption(0);});

    // real-time polling of invalid input correction
    $("#inputTitle").on("input", function() {validateInputs("title");});                    // QUESTION:    takes some time before this fires, how to make it fire more quickly?
                                                                                                                            // ANSWER:      use the "oninput" event, previously used onkeydown
    $("#selectRating").on("change", function() {validateInputs("rating");});
    $("#inputLink").on("input", function() {validateInputs("link");});

    // main eventlisteners
    $("#btnAddContent").on("click", function() {addContent();});
}

function init()
{
    preventDefault();
    addEventListeners();
}

/* method used to test during development */
function devtest()
{

}

$(document).ready(init);

修改

    var a = image.substring(0,7);
    var b = image.substring(image.length-4);
    alert(a);
    alert(b);
    if(a != "http://" && b != ".jpg" && b != ".png")
    {
            $("#inputImage").css("background-color", "red");    // <-- not being executed
            flag = false;
    }
    return flag;

无法获取$("#inputImage").css("background-color", "red");语句，即使条件应该被评估为true。

Answer 1

如果字符串的第一部分不是http://且字符串最后四个字符既不是.jpg也不是.png

，则以下代码将被评估为true

if (image.substring(0,7) != "http://" && 
    image.substring(image.length-4) != ".jpg" && 
    image.substring(image.length-4) != ".png")

Answer 2

好的，经过一夜好眠，这是正确的解决方案：

    var imagebegin = image.substring(0,7);
    var imageend = image.substring(image.length-4);
    if(imagebegin != "http://" || (imageend != ".jpg" && imageend != ".png"))
    {
            $("#inputImage").css("background-color", "red");
            flag = false;
    }
    return flag;

只有当字符串的开头为＆＃34; http：//＆＃34;时才会进行验证。最后是＆＃34; .jpg＆＃34;或者＆＃34; .png＆＃34;，如果这些条件中的任何一个都不满足，那么if语句将评估为true，并且将执行其中的语句（包括将标志设置为false）。

Answer 3

抱歉，我没有正确地阅读你的答案，但我认为无论如何我给了正确的提示

if (image.substring(0,7) != "http://" && image.substring(image.length-4) != ".jpg" && (image.substring(image.length-4) != ".png" || image.substring(image.length-4) != 'or'))

if-statements with＆amp;＆amp;和||在JavaScript中

3 个答案: