Question

我开始将成为DNA翻译者。我把它设置为从DNA文本框中取出文本，使其全部为小写。我知道有很多工作要做。但是，验证它是否都是字母字符的功能不起作用。我想知道我做错了什么。最终的输出不会是“document.write（）”，这只是暂时的，看看它是否正常工作。代码如下。

HTML：

<!DOCTYPE html>
<html>
    <head>
    <title>DNA Translator</title>
    <link rel="stylesheet" type="text/css" href="stylesheet.css"/>
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="script.js"></script>
    <script></script>
    </head>
    <body>
        <div id="wrapper">
            <form>
                <label for="dna">DNA:</label>
                <input type="text" name="dna" placeholder="DNA">
                <label for="mrna">mRNA:</label>
                <input type="text" name="mrna" placeholder="mRNA">
                <label for="trna">tRNA:</label>
                <input type="text" name="trna" placeholder="tRNA">
                <label for="aminoAcids">Amino Acids:</label>
                <input type="text" name="aminoAcids" placeholder="Amino Acids">
                <div class="buttons">
                    <button id="button_translate" type="button">Tanslate</button>
                    <button id="button_clear" type="button">Clear</button>
                </div>
            </form>
        </div>
    </body>
</html>

使用Javascript：

$(document).ready(function() {
    $('#button_translate').mouseenter(function() {
        $('#button_translate').fadeTo('fast', 1);
    });
    $('#button_translate').mouseleave(function() {
        $('#button_translate').fadeTo('fast', 0.7);
    });
    $('#button_clear').mouseenter(function() {
        $('#button_clear').fadeTo('fast', 1);
    });
    $('#button_clear').mouseleave(function() {
        $('#button_clear').fadeTo('fast', 0.7);
    });
    $('#button_translate').click(function() {
        var dna = $('input[name=dna]').val();
        var dna = dna.toLowerCase();
        function allLetters(text) {  
            var letters = /^[A-Za-z]+$/;  
            if(text.value.match(letters)) {  
                document.write("That is a DNA sequence.");
            }
            else
            {  
                document.write("Not a real DNA sequence.");
            }  
        }

        allLetters(dna);
    });
});

CSS（如果重要的话）：

#wrapper {
    margin-top: 10%;
}

label {
    width:100px;
    font-size:18px;
    font-family:"Myriad Pro", Myriad, "Liberation Sans", "Nimbus Sans L", "Helvetica Neue", Helvetica;
    text-align:right;
    float:left;
    clear:left;
    padding-top:5px;
    padding-right:20px;
}

#button_translate {
    float:left;
    opacity:0.7;
    display:inline-block;
    height:35px;
    width:180px;
    background-color:#293FE3;
    font-family:arial;
    font-weight:bold;
    color:#ffffff;
    border-radius:5px;
    text-align:center;
    margin-top:2px;
    /*display:block;*/
    margin:15px auto;
}

#button_clear {
    float:right;
    opacity:0.7;
    display:inline-block;
    height:35px;
    width:180px;
    background-color:#293FE3;
    font-family:arial;
    font-weight:bold;
    color:#ffffff;
    border-radius:5px;
    text-align:center;
    margin-top:2px;
    /*display:block;*/
    margin:15px auto;
}

input[type="text"] {
    width:390px;
    height:20px;
    padding:4px 6px;
    margin-bottom:40px;
    color:#555;
    background-color:#fff;
    border:1px solid #ccc;
    float:left;
    font-size:14px;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    border-radius:4px; 
    -webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition:border linear .2s, box-shadow linear .2s;
    -moz-transition:border linear .2s, box-shadow linear .2s;
    -o-transition:border linear .2s, box-shadow linear .2s;
    transition:border linear .2s, box-shadow linear .2s
}

form {
    width:524px;
    margin-left:auto;
    margin-right:auto;
}

.buttons {
    text-align:center;
    float:right; 
    width:404px
}

#dna {
}

#mrna {
}

#trna {
}

#aminoacids {
}

Answer 1

text已经是您要匹配的值，因此请更改：

if(text.value.match(letters)) {
..

到

if(text.match(letters)) {
...

如何在javascript中验证字母字符？

1 个答案: