簡體   English   中英

如何在單擊時獲取目標的名稱並將值分配給另一個變量?

[英]how to get the name of the target on click and assign the value to another variable?

所以我有一個空變量

var pName= null;

每次單擊圖像時,我都希望變量“ pName”更改為該圖像的名稱。

$(document).ready(function(){
$('img').on('click', check)
});

function check(){
    pName == target.name.value;
    console.log('pName');
}

現在,我想將此變量的值設置為隱藏形式(或任何其他方式,如果您建議的話),在php中選擇它,並將變量“ $ pName”(在php中)的值更改為隱藏的形式。

<label><input type="hidden" name="pNameChange" value=""></label>

我想在每一頁上都這樣做。 我的代碼似乎無效。

編輯

我在每個頁面$ pName(php)上都有一個變量。 我希望它動態更改為您單擊的圖像的名稱。 我不知道我是否做對了。

編輯2

這是我的項目php文件:

<?php
$newRecord = null;
$pName = "kkk";
$db_connection = mysqli_connect('localhost','root','',"project_online_planner");
if (!$db_connection){
    die('Failed to connect to MySql:'.mysql_error());
}

//insert into database
if(isset($_POST['insertComments'])){
    include('connect-mysql.php');
    $username = $_POST['username'];
    $comment = $_POST['comment'];
    $sqlinsert = "INSERT INTO user_comments (username, comment, project) VALUES ('$username', '$comment', '$pName')";
        if (!mysqli_query($db_connection, $sqlinsert)){
            die('error inserting new record');
        }
        else{
            $newRecord = "1 record added";
        }//end nested statement

}

//text from database
$query="SELECT * FROM user_comments where project = '$pName' ";
$results = mysqli_query($db_connection,$query);
$intro=mysqli_fetch_assoc($results);

$query2="SELECT * FROM project where name = '$pName' ";
$results2 = mysqli_query($db_connection,$query2);
$intro2=mysqli_fetch_assoc($results2);


?>

在這里,我使用$ pName作為項目的名稱。 我項目中的每個圖像都有它們所在項目的名稱。我試圖將變量$ pName的值動態更改為單擊的圖像。

這是我所有的項目php文件:

<?php
$pName =
$db_connection = mysqli_connect('localhost','root','',"project_online_planner");
if (!$db_connection){
    die('Failed to connect to MySql:'.mysql_error());
}
$query="SELECT * FROM project ";
$results = mysqli_query($db_connection,$query);
$intro=mysqli_fetch_assoc($results);
?>
<!DOCTYPE HTML>
<html>
<head>
    <title>Project planner online</title>
    <script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
    <script type="text/javascript" src="ppo.js"></script>
    <link rel="stylesheet" href="ppo.css"/>
</head>
<body>
<div id="bgNav">
    <nav id="nav">
        <a href="index.php">Home</a>
        <a class="rightNav" href="register.php">Register</a>
        <a class="rightNav" href="login.php">Log in</a>
    </nav>
</div>
<h2 class="titlePage">All projects</h2>
<div id="hugeTile">
    <?php

    while($row = mysqli_fetch_array($results))
    {
        $project = $row["project"];
        echo "<div class='allProjectsWrapper'>";
        echo nl2br("<div class='allProjectsTitle'>" . $row['name'] . "</div>");
        echo nl2br("<div class='project'>" ."<img name=\"$project\" width='240px' height='170px'  src='". $row['image'] ."'/>". "</div>");
        echo "</div>";
    }
    ?>
</div>
<form>
    <label><input type="hidden" name="pNameChange" value=""></label>
</form>

這樣使用

$('img').click(function(){
   pname= $(this).attr("name");
  });

首先將ID添加到隱藏字段

<label><input type="hidden" name="pNameChange" id="pNameChange" value=""></label>

然后您可以像這樣拾取圖像名稱

$('img').click(function()
{
    path = $(this).attr('src').split('\/');
    $img_name = path[path.length-1];
    $('#pNameChange').val($img_name); //Changing the pNameChange value
});

如果您只想在單擊圖像后更改“ pNameChange ”的值,則不需要PHP。

還有,當你做

pName == target.name.value;

它不分配值,它使用比較。

=用於分配值。

==用於比較

確保您已全局定義var,從圖像中獲取href屬性,然后通過其名稱設置輸入,因為那里沒有ID:

<script type="text/javascript">
    var pName = '';

    $(document).ready(function(){
        $('img').on('click', function(){
            pName = $(this).attr('href');
            $("input[name=pNameChange]").val(pName);
        })
    }); 
</script>

this在局部范圍內將是從DOM圖像元素。

您需要解析在php中發送的href屬性,因為它將具有完整的img url,除非您使用自定義屬性或將名稱放在圖像ID或類似的名稱中:

<?php 
    $segments = explode('/', $pName);

    if(!empty($segments)) {
        $length = count($segments);
        $img_name = $segments[$length-1];
    }
?>

只需在您的check()函數中使用它即可:

$("#pNameChange").val(pname);

並且不要忘記在輸入中添加id“ pNameChange”

<input type="hidden" id="pNameChange" name="pNameChange" value="">

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM