1

I have a page full of divs that contain 1 button each which submit to do a certain function successfully.

However I am currently trying to isolate the buttons by an ID and trigger the addition of a class and message to 2 spots within the div (input value & the #msgsC).

However, the event is not triggering at all. And I think I may be missing something. How can I get it to change/add the class and message to only the sibling input tag and #msgsC of the particular button that is clicked (AND not to all of the inputs in all the divs on the page simultaneously)?

<form id="Hello" target="somePlace" action="#" method="post">
    <table>
        <tr>
            <td>
                <select name="os0">
                    <option value="item1">item1</option>
                    <option value="item2">item2</option>
                    <option value="item3">item3</option>
                    <option value="item1">item4</option>
                </select>
            </td>
        </tr>
        <tr>
            <td>
                <input type="hidden" name="on1" value="Send My URL"/>Send My URL
            </td>
        </tr>
        <tr>
            <td>
                <input type="text" value="http://" name="os1" id="os1" maxlength="200"/>
            </td>
        </tr>
    </table>
    <button alt="Click the button" id="purchase1" name="submit" class="btn" type="image">Add To Cart</button>
</form>




$(document).ready(function () {
    $('#purchase1, #purchase2, #purchase3').on('click', 'button', function (e) {
        var urlGo = new Array(url1, url2, url3);

        for (var x = 0; x < urlGo.length; x++) {

            if (!/(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/.test(urlGo[x].val())) {
                $(this).siblings("input[type=text]").addClass("errorAlert");
                $(this).siblings("input[type=text]").val(emptyerror);
                $(this).siblings("#msgsC").addClass("text-error");
                $(this).siblings("#msgsC").html(htmlEmpty);

            } //end of if
        } //end of for
    }); // end of purchase button function
}); // end document ready
4

1 回答 1

2

.指一个类，#一个id。

.purchase选择类购买的#purchase元素，选择id购买的元素。

利用

$('#purchase1, #purchase2, #purchase3').on(...

因为 purchase1、purchase2、purchase3 是 ID。

如果您只对点击感兴趣并且这些元素只加载一次并且没有被替换或删除，您也可以使用，

$('#purchase1, #purchase2, #purchase3').click(function(){..

你也可以给他们一个共同的类，“购买”。

然后使用，

$('.purchase').click(function(){  ....});

但请记住，id 是独一无二的。

于 2013-09-03T15:47:14.760 回答