Question

我会尽量使我的问题变得简单明了。所以我最近阅读了stackoverflow上的.prop() vs .attr()页面，并决定开始使用- (IBAction)loginbtn:(id)sender { [self.tx1 resignFirstResponder]; [self.tx2 resignFirstResponder]; if (self.tx1.text.length == 0) { UIAlertView *alert = [[UIAlertView alloc]initWithTitle:@"Error" message:@"Please Enter User Name" delegate:self cancelButtonTitle:@"OK" otherButtonTitles:nil, nil]; [alert show]; } else if (self.tx2.text.length == 0) { UIAlertView *alert = [[UIAlertView alloc]initWithTitle:@"Error" message:@"Please Enter Password" delegate:self cancelButtonTitle:@"OK" otherButtonTitles:nil, nil]; [alert show]; } AppDelegate *appDelegate = (AppDelegate *)[[UIApplication sharedApplication]delegate]; context = [appDelegate managedObjectContext]; NSFetchRequest *request= [[NSFetchRequest alloc] init]; NSEntityDescription *entity = [NSEntityDescription entityForName:@"Loginform" inManagedObjectContext:context]; NSPredicate *predicate =[NSPredicate predicateWithFormat:@"name==%@ AND password==%@",self.tx1.text, self.tx2.text]; [request setEntity:entity]; [request setPredicate:predicate]; NSError *error; NSMutableArray *results = [self.managedObjectContext executeFetchRequest:request error:&error]; Loginform *anAccount = results.firstObject; if(anAccount!=nil){ if([anAccount.name is equalToString self.tx1.text && [anAccount.password isEqualToString:self.tx2.text]]) { //login success homeViewController*home = [[homeViewController alloc]initWithNibName:@"homeViewController" bundle:Nil]; [self presentViewController:home animated:YES completion:Nil]; }else{ UIAlertView *alert = [[UIAlertView alloc]initWithTitle:@"Error" message:@“Username or password is wrong" delegate:self cancelButtonTitle:@"OK" otherButtonTitles:nil, nil]; [alert show]; } } }而不是prop()。

HTML

attr()

JQuery的

<form action="php/select.php" method="POST" class="ajax">
    <fieldset>
        <legend>Show</legend>
        <div>
            <input type="submit" value="Show Servers"/>
        </div>
        <div id="output"></div>
    </fieldset>
    <input type="hidden" name="action" value="SHOW_SERVERS"/>
</form>

这是一个奇怪的部分，当我提交该表单时，它在控制台中打印的是这个

我的问题是：

为什么JQuery返回一个输入元素而不是form动作属性的值？

为什么$(document).ready(function(){ $("form.ajax").on("submit",function(e){ e.preventDefault(); var t=$(this); var form=t.serialize(); var method=t.prop("method"); var url=t.prop("action");//Before: t.attr("action"); console.log(url); }); });可以获取方法属性的值，但不能获取操作属性

PS：我已经知道输入具有属性.prop()。

Answer 1

为什么JQuery返回一个输入元素而不是返回值形成行动财产？

它与jQuery没有任何关系。

这是HTML本身的规范。表单中的控件随表单一起提交，控件的name成为表单的属性。更多信息：http://www.w3.org/TR/html401/interact/forms.html#control-name

这与form标记上的属性不同。

所以，如果你没有使用jQuery，如果要引用一个名为input的{{1}}元素，你就可以example执行此操作。

小提琴：https://jsfiddle.net/abhitalks/jct8ksr3/

摘录：

formname.example

$("form.ajax").on("submit",function(e){
	e.preventDefault();
	console.log(this.example);
});

jQuery所做的是它用<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form action="php/select.php" method="POST" class="ajax"> <div> <input type="text" name="example" value="test"/> <input type="submit" value="Show Servers"/> </div> </form>公开attribute s。这些返回实际上不从源更改的属性值（标记的）。但是，jQuery还公开了元素的属性（包含的标记属性的当前值）。并且因为表单控件名称作为属性附加到表单，它也将返回它们。

您可以通过在代码中记录它来看到：

attr

Answer 2

method属性不适用于boolean值。您需要使用attr()。 prop()仅应用于设置和重置布局值，例如disabled或checked。

$(document).ready(function(){
    $("form.ajax").on("submit",function(e){
        e.preventDefault();
        var t=$(this);
        var form=t.serialize();
        var method=t.attr("method");  // Change here
        var url=t.attr("action");     // Change here
        console.log(url);
    });
});

仅供参考，prop() 不是attr()的替代品。考虑一下：

<input type="checkbox" name="chkBox" checked="checked" id="chkBox" />

使用：

$("#chkBox").prop("checked"); // true
$("#chkBox").attr("name");    // chkBox

使用相同的代码，我想它应该可以工作：

$(document).ready(function() {
  $("form.ajax").on("submit", function(e) {
    e.preventDefault();
    var t = $(this);
    var form = t.serialize();
    var method = t.attr("method");
    var url = t.attr("action");
    console.log(url);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form action="php/select.php" method="POST" class="ajax">
  <fieldset>
    <legend>Show</legend>
    <div>
      <input type="submit" value="Show Servers" />
    </div>
    <div id="output"></div>
  </fieldset>
  <input type="hidden" name="action" value="SHOW_SERVERS" />
</form>

我可以在控制台中看到php/select.php。

正如Álvaro González所述，它返回<input />的原因是（我不想接受这个功劳），这是因为如果有<input name="something">，那么{ {1}}。<form>将是表单的属性。因此something与同一prop()和name混淆了。

有关详细信息，请参阅named form fields become properties of parent form。

Answer 3

正如您可能已经怀疑的那样，混淆的原因是您在代码中使用了“action”一词两次：

<form action="php/select.php" method="POST" class="ajax">
      ^^^^^^
<input type="hidden" name="action" value="SHOW_SERVERS"/>
                           ^^^^^^

从jQuery 1.6开始，t.attr("action")专门提取HTML属性，t.prop("action")提取JavaScript属性。所以：

t.attr("action")抓取action="php/select.php"（这是直截了当的）
t.prop("action")抓取财产。自named form fields become properties of parent form起，我们就会得到相应的<input>。

这是新逻辑有助于避免歧义的一个很好的例子。

Answer 4

查看jQuery源代码（jquery-1.11.3.js中的第8239行），您可以看到prop函数在调用给定元素字段时依赖（经过多次检查）。

在您的示例中，元素是表单，您尝试获取的字段为method和action。它返回method的'post'，因为method是表单的正确字段（DOM对象），因此form[method]按预期返回'post'。现在关于action，表单中没有action字段（DOM对象），因此调用form[action]实际上会触发一个底层机制，最终返回表单中的第一个元素{ {1}} action属性：您在控制台中看到的name。

.prop（）返回object而不是value

4 个答案: