0

誰からも助けていただければ幸いです...以下のPHPにはtxtファイルのアイテムのリストが含まれています。各アイテムの横には、ユーザーが数量を入力するためのテキストボックスがあり、デフォルトでは1に設定されています。クリアしようとしていますユーザーがテキストボックスをクリックしたときのボックス、何かアイデアはありますか?

<input type='text' id='qty' name='$partno' size='1' value='0'>

これまでのところ、JavaScript を使用してみましたが、うまくいきませんでした。

        <script>
        function validateName()
        {
            var x=document.forms["purchase"]["visitor"].value;
            if (x==null || x=="")
            {
                alert("Visitor name must be entered");
                return false;
            }
        }

        function name()
        {  
            document.getElementById('qty').value = "";
        }
    </script>
</head>

<body>

    <h1>Items Available</h1>

    <form id="purchase" name="purchase" action="confirm.php" method="post" onsubmit="return validateName()">
        <table>

            <h3>Visitor Name: <input type='text' name='visitor'></h3>
            <tr><th></th><th></th><th></th><th>Price</th><th>QTY</th></tr>

            <?php
            if (!($data = file('items.txt'))) {
                echo 'ERROR: Failed to open file! </body></html>';
                exit;
            }
            foreach ($data as $thedata) {

                list($partno, $name, $description, $price, $image) = explode('|', $thedata);
                echo "<tr><td><img src='$image' width='60' height='60' alt='image'></td><td><h3>$name</h3></td><td>&nbsp;&nbsp;&nbsp;&nbsp;$description</td>
                    <td>&nbsp;&nbsp;&nbsp;&nbsp;<b>&pound;$price</b></td><td><input type='text' id='qty' name='$partno' size='1' value='0'></td></tr>";
                //<input type='text' size='1' name='partno_qty' value='1'</td>
            }
            ?> 

        </table>

        <input type="submit" value="Purchase">
        <input type="reset" value="Clear">

    </form>
4

2 に答える 2

1

Add an onclick or onfocus handler to your "input name=qty" tag, or look at using a "placeholder" attribute, which may not work in some browsers you have to support:

foreach ($data as $thedata)
{
    list($partno, $name, $description, $price, $image) = explode('|', $thedata);
                echo '<tr><td><img src="' . $image . '" width="60" height="60" alt="image"></td>'
                . '<td><h3>' . $name . '</h3></td><td>&nbsp;&nbsp;&nbsp;&nbsp;' . $description . '</td>'
                . '<td>&nbsp;&nbsp;&nbsp;&nbsp;<b>&pound;' . $price . '</b></td>'
                . '<td><input type="text" id="part-' . $partno . '" '
                . 'name="' . $partno . '" size="1" '
                . 'value="0" onfocus="this.value=\'\';" placeholder="0"></td>'
                . '</tr>';
}

The "onclick/onfocus" approach will clear the box every time it's clicked/entered. If you wish to use your "name" function, the call changes to this:

onfocus="name( this );"

And "name" changes to:

function name( obj )
{  
    obj.value = "";
}
于 2013-03-27T19:40:32.673 に答える
0

placeholderHTML5とrequired属性を使用できます。

<form>
<input type="text" placeholder="Name" required />
<input type="submit" value="submit" />
</form>

デモ

注:
このplaceholder属性は、Internet Explorer 10、Firefox、Opera、Chrome、および Safari でサポートされています。このrequiredタグは、Internet Explorer 10、Firefox、Opera、および Chrome でサポートされています。Safari ではサポートされていません

または、次のように JS で実行できます。

<input type="text" onfocus="inputFocus(this, 'initial text')" onblur="inputBlur(this, 'initial text')" value="initial text" />

'initial text'ページがロードされたときのテキスト入力のデフォルト値です。eg('Your Name')。

function inputFocus(elm, placeholder){
    if (elm.value == placeholder){ elm.value = "" }

}

function inputBlur(elm, placeholder){
    if (elm.value == "" || elm.value == placeholder){
        elm.style.border = "1px solid red";
        elm.value = placeholder;
        alert("Visitor name must be entered");
    }else{
        elm.style.border = "1px solid green";
    }
}

デモ

于 2013-03-27T19:47:29.127 に答える