Question

提交表格后如何更改表格和结果div的背景？我想将图像的背景和结果从图像更改为颜色。

怎么做？我尝试过这个我发现的解决方案，但它无效，http://jsfiddle.net/tymeJV/YL6Da/

<form action="" method="post" name="locator">
    <div class="locator-div">
        <select name="locator1_list" id="filterby">
            <option name="default" class="filter_by" value="Select by">Select by</option>
        </select>
    </div>
    <span class="or">or</span>
    <div class="locator-div">
        <select name="locator1_list" id="filterby">
            <option name="default" class="filter_by" value="Select by">Select by</option>
        </select>
    </div>
    <input type="submit" value="List all locations" class="location-submit">
</form>

<div class="records"><div><span class="icons-tabbed-store icon-icon-stores"> Location 1</span></div></div>

Answer 1

尝试这样：

$("form").submit(function(e) {

     e.preventDefault();
    var bool = false;
    
    if (bool) {
        $("form").addClass("success");
        $(".records").addClass("error");
    } else {
        $("form").addClass("error");
        $(".records").addClass("success");
    }
});

复制那个css类并添加background-image：none

Answer 2

我不确定，我说得对，但无论如何。

如果你需要改变任何元素的样式，你需要做的就是使用这个jQuery css方法，例如： -

$("#message").css("background-color","green")

或者您可以使用AddClass方法，这就是您在小提琴上所做的事情

为什么它不起作用，因为你在textarea中写了内联样式

style="color: white; background-color: grey; display: none

内联样式具有最高优先级，因此它将替换/覆盖外部css类中编写的任何样式，如＆＃34; .success＆＃34;

因此您可以选择使用类并使用AddClass / removeClass方法，也不要在标记本身中编写样式

OR

使用内联样式并使用css方法更新

Answer 3

你想做Synch还是Asynch？如果是Asynch，你需要使用AJAX：

$("#id-of-form").submit(function(e) {
e.preventDefault();

$.ajax({
    url: 'url-of-form',
    type: 'post',
    success: function (response)
    {
        var bool = false;

        if (bool) {
            $("#message").fadeIn("slow").removeAttr("style").addClass("success").text("Successful!");
        } else {
            $("#message").fadeIn("slow").removeAttr("style").addClass("error").text("Failed");
        }
    }
}); 
});

基本上你在这里做的是将一个函数附加到submit事件并通过Ajax重新提交它，从而进行Asynch调用。

如果您需要Synch，则需要使用PHP或您正在使用的任何语言。

提交表格后如何更改div？

3 个答案: