Question

我有一个像

这样的html文件

HTML- index.php

<form name="myform" action="data.php">
  <ul>
    <li onclick=myform.submit();>
      <input type="hidden" name="soc" value="1">google</li>
    <li onclick=myform.submit();>
      <input type="hidden" name="soc" value="2">facebook</li>
    <li onclick=myform.submit();>
      <input type="hidden" name="soc" value="3">twitter</li>
    <li onclick=myform.submit();>
      <input type="hidden" name="soc" value="4">none</li>
  </ul>
</form>

data.php

<?php
$val = &_POST["soc"];
echo $val;
?>

如果我点击其中的任何一个，它只传递最后<li>值4。我想在我点击的位置只获得此<li>值我的意思是说，如果我点击Facebook，那么我可以在data.php文件中获得值'2'。

Answer 1

而不是form只使用带有url参数的a标记，这可能是更好更简单的方法

<强> HTML：

<ul>
  <li> <a href="data.php?soc=1">google</a>
  </li>
  <li> <a href="data.php?soc=2">google</a>
  </li>
  <li> <a href="data.php?soc=3">google</a>
  </li>
  <li> <a href="data.php?soc=4">google</a>
  </li>
</ul>

<强> PHP：

<?php
$val = $_GET["soc"];
echo $val;
?>

Answer 2

您不能使用具有相同名称的多个隐藏输入，并期望它们表现为独立的表单元素。提交表单时，所有隐藏的输入都以soc = 1＆amp; soc = 2＆amp; soc = 3＆amp; soc = 4发送保留一个名为=＆＃34; soc＆＃34;的隐藏输入。并在每个onclick属性中更改回调，如：

document.forms.myform.soc=1;document.formsmyform.submit();

将数字更改为每个li元素的相应值

Answer 3

有很多方法可以做到这一点

为每个li创建不同的表单。

<ul>
    <form name="myform1" action="data.php">  
        <li onclick=myform1.submit();><input type="hidden" name="soc" value="1">google</li>
    </form>
    <form name="myform2" action="data.php">  
        <li onclick=myform2.submit();><input type="hidden" name="soc" value="2">facebook</li>
    </form>

</ul>

使用jquery通过单击事件替换值

HTML

<form name="myform" action="data.php">
  <ul>
    <li id="1">google</li>
    <li id="2">facebook</li>
    <li id="3">twitter</li>
    <li id="4">none</li>
  <input type="hidden" name="custom" value="" id="myid" />
  </ul>
</form>

<强>的js

<script>
$(document).ready(function(){
    $(li).click(function(){
        var val = $(this).attr(id);
        $("#myid").val(val);
        myform.submit();
        return true;
    })
})
</script>

将url中的值作为查询字符串传递。

Answer 4

在ajax中你应该使用$val = $_POST["soc"]。您可以使用ajax请求

<强> JS

$(function() {

  $('.opt').on('click', function(){

    var val = $(this).val();
    $.ajax({
      url: "data.php",
      type: 'POST',
      data: {soc: val},
      success: function() {
        console.log('success');
      }
    })
  })
})

<强> HTML

<ul>
<li class="opt"><input type="hidden" name="soc" value="1">google</li>
<li class="opt"><input type="hidden" name="soc" value="2">facebook</li>
<li class="opt"><input type="hidden" name="soc" value="3">twitter</li>
<li class="opt"><input type="hidden" name="soc" value="4">none</li>
</ul>

PHP：

<?php
$val = $_POST["soc"];
echo $val;
?>

Answer 5

如果您正在寻找纯粹的jQuery / JS解决方案

<强> HTML

<form name="myform" action="data.php">
  <ul>
    <li onclick="submitMyForm(1)">
      google
    </li>
    <li onclick="submitMyForm(2)">
      facebook
    </li>
    <li onclick="submitMyForm(3)">
      twitter
    </li>
    <li onclick="submitMyForm(4)">
        none
    </li>
  </ul>
</form>

<强> JS

function submitMyForm(val) {
    $.ajax({
      url: "data.php",
      type: 'POST',
      data: {soc: val},
      success: function() {
        console.log('success');
      }
   })
}

<强>的jsfiddle

https://jsfiddle.net/p0cf8c0L/

如何使用jquery传递特定的<li>值

5 个答案: